Изменение моего типа .click с JQuery

Question

Я меняю РОМ от:

<div class="empty item1 ui-state-default" id="add1"></div> 

Для этого:

<div class="item1 ui-state" id="add1"> 
<img src="uploads/anonymous-1367982603.png" width="45" height="60" class="expand"> 
</div> 

Я этот код, который работает с .live(), но он игнорирует это и имеет значение .ui-state-default, даже если этот код был удален из DOM.

$('.expand').live('click', function(e){ 
var blowup = $(this); 
$(blowup).css({"height":"100%","hidden":"overflow","position":"absolute","width":"100%","top":"0px","left":"0px","z-index":"100"}); 
$(blowup).removeClass("expand"); 
$(blowup).addClass("zoomy"); 
});  

Но проблема в том, что это все еще открывается при щелчке, который срабатывает при готовности.

$('.ui-state-default').bind('click', function(e) { 
    $(".upload").show(); 
    }); 

Answer 1

При использовании .bind() для регистрации обработчиков событий, селектор проверяется, когда код регистрации событий выполняется, т.е. обработчик событий добавляется к элементу. Изменения, внесенные в элемент после этого, не будут влиять на выполнение обработчика, пока он не будет незарегистрирован.

В вашем случае возможным решением является использование модели делегирования событий, где селектор будет протестирован непосредственно перед вызовом обработчика.

Изменить

$('.ui-state-default').bind('click', function(e) { 
    $(".upload").show(); 
}); 

в

$(document).on('click', '.ui-state-default', function(e) { 
    $(".upload").show(); 
}); 

Update: решение Обходной с помощью привязки

$('.ui-state-default').bind('click', function(e) { 
    if($(this).hasClass('ui-state-default')){ 
     $(".upload").show(); 
    } 
});