2012-10-31 100 views
1

基本上我试图通过解绑元素来优化我的jQuery代码,任何时候都是必要的,或者我需要重新绑定它们,但是我有一个问题,“摧毁”一个元素是否也会破坏附加到该元素的事件?销毁一个元素会销毁该元素上的绑定?

$(element).bind("click", function(){...}); 
$(element).parent().html(""); 

而且我不知道如果这是以.html(“”)来完成,我必须用一个.remove()这样的伎俩?

回答

2

只要你使用jQuery方法添加/删除元素并绑定事件,一切都应该没问题。当你将一个事件绑定到一个元素上(或者使用类似于.data()的东西)时,jQuery将这些信息存储在一个叫做$.cache的地方。当你使用jQuery方法来操作DOM时,jQuery负责清理这些东西 - 因为在元素和$.cache之间确实没有实际的连接。因此,如果您在页面中添加了div,则使用jQuery绑定click事件,然后使用node.parentNode.removeChild(node);删除它,$.cache未清理。如果你想的证据,看在jQuery的源像htmlremovereplaceWith方法以及类似的,你会发现这样的电话:

jQuery.cleanData(elem.getElementsByTagName("*")); 
jQuery.cleanData([ elem ]); 

这有效地清理$.cache使一切已搞定。关键是,如果你使用图书馆来处理(所有),你就不必担心这些事情。

使用html虽然很棘手 - 要小心你传递给它的东西。如果你想传递一个新的DOM结构,像

var div = $("<div>") 
       .attr("id", "div1") 
       .click(function() { 
        alert("clicked"); 
       }); 

使用类似$("#container").html(div);实际上不会绑定该点击事件处理程序。虽然使用类似.append的东西。只是想指出。 (这与摧毁/删除元素无关)

+1

真棒答案和有趣的顺便说一句,是啊我知道绑定事件只适用于绑定完成时存在的元素;这就是为什么我重新加载时解除绑定元素的原因,这次的问题是当我有这么多元素更好地清空或销毁父元素而不是解除绑定200个元素。如果我有任何问题,我会尝试您的解决方案并发布。谢谢! –

1

如果您删除该元素,DOM将不再监听该元素内的点击。

.remove应该做的伎俩。

$(element).parent().remove(); 

将从DOM中删除元素。

+0

顺便说一句,您的应用/网站有多大? –

+0

'$(element).parent()。remove();'移除父 - 你不想这样做。 '$(element).remove()'会工作得很好。 – Ian

+1

'.on' /'.bind'的评论完全是题外话......而IMO则没有回答这个问题。是的,如果你用'.html'移除一个元素,那么它不能再触发事件,但事件监听器是否仍然存在? –