我试图弄清楚如何执行一些js代码时,一个元素从页面删除:

jQuery('#some-element').remove(); // remove some element from the page
/* need to figure out how to independently detect the above happened */

有没有专门的活动,比如:

jQuery('#some-element').onremoval( function() {
    // do post-mortem stuff here
});

当前回答

没有用于删除元素的内置事件,但是可以通过伪扩展jQuery的默认删除方法来创建一个事件。注意,必须在实际删除回调以保持引用之前调用回调。

(function() {
    var ev = new $.Event('remove'),
        orig = $.fn.remove;
    $.fn.remove = function() {
        $(this).trigger(ev);
        return orig.apply(this, arguments);
    }
})();

$('#some-element').bind('remove', function() {
    console.log('removed!');
    // do pre-mortem stuff here
    // 'this' is still a reference to the element, before removing it
});

// some other js code here [...]

$('#some-element').remove();

注意:这个答案的一些问题已经被其他的帖子概括出来了。

当通过html() replace()或其他jQuery方法删除节点时,这将不起作用 这个事件出现了 jQuery UI覆盖删除以及

这个问题最优雅的解决方案似乎是:https://stackoverflow.com/a/10172676/216941

其他回答

我喜欢mtkopone使用jQuery特殊事件的答案,但请注意,它不能工作a)当元素被分离而不是删除或b)当一些旧的非jQuery库使用innerHTML破坏你的元素

为此,可以使用jQuery特殊事件。

简单地说,

设置:

(function($){
  $.event.special.destroyed = {
    remove: function(o) {
      if (o.handler) {
        o.handler()
      }
    }
  }
})(jQuery)

用法:

$('.thing').bind('destroyed', function() {
  // do stuff
})

回答Pierre和DesignerGuy评论的附录:

要在调用$('.thing').off('destroyed')时不触发回调,请将if条件更改为:if (o.handler && o.type !== 'destroyed'){…}

参考@David的回答:

当你想做soo与另一个函数,例如。Html()就像在我的情况下,不要忘记在新函数中添加return:

(function() {
    var ev = new $.Event('html'),
        orig = $.fn.html;
    $.fn.html = function() {
        $(this).trigger(ev);
        return orig.apply(this, arguments);
    }
})();

我们也可以使用domnodermoved:

$("#youridwhichremoved").on("DOMNodeRemoved", function () {
// do stuff
})

挂钩.remove()并不是最好的处理方法,因为有很多方法可以从页面中删除元素(例如,通过使用.html(), .replace()等)。

为了防止各种内存泄漏危险,jQuery将在内部尝试为每个被删除的元素调用jQuery. cleandata()函数,而不管使用什么方法来删除它。

查看这个答案了解更多细节:javascript内存泄漏

所以,为了得到最好的结果,你应该钩子cleanData函数,这正是jquery.event.destroyed插件所做的:

http://v3.javascriptmvc.com/jquery/dist/jquery.event.destroyed.js