jquery .remove（）方法不会触发.on（’remove’）事件

我正在使用.remove（）方法删除一个html元素，同时对于这个元素，我有一个事件处理程序，但它没有被触发。 为什么会这样？ 这是jsFiddle和代码：HTML

Delete
 I'm going to be deleted 

JS

 $('#del_span').click(function() { $('#to_del').remove(); }); $('#to_del').on('remove', function() { alert("I'm being deleted"); //is never triggered }); 

Answer 1

remove()方法不会自动触发remove事件（因为不存在此类事件），您可以使用自定义事件手动执行此操作：

 $('#del_span').click(function() { $('#to_del').trigger('remove').remove(); }); $('#to_del').on('remove', function() { alert("I'm being deleted"); //is never triggered }); 

JS小提琴演示 。

顺便说一句，在那些支持突变事件的浏览器中，您可以使用：

 $('#del_span').click(function() { $('#to_del').remove(); }); $('body').on('DOMNodeRemoved', '#to_del', function() { alert("I, " + this.id + " am being deleted"); }); 

JS小提琴演示 。

参考文献：

• trigger() 。

Answer 2

当您包含jQuery UI时，将覆盖$.cleanData方法以触发remove事件。 您可以非常轻松地以相同的方式模仿此行为：

 // copied from jQuery UI Github, link below var _cleanData = $.cleanData; $.cleanData = function( elems ) { for ( var i = 0, elem; (elem = elems[i]) != null; i++ ) { try { $( elem ).triggerHandler( "remove" ); // http://bugs.jquery.com/ticket/8235 } catch( e ) {} } _cleanData( elems ); }; 

https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.widget.js#L16

$.cleanData由.remove方法调用，以.remove存储在元素上的任何数据和事件。 注意，这也会导致在通过其他方式删除元素时触发remove事件，例如.empty()

Answer 3

为了增加大卫托马斯的答案 ，我做了一个litle插件来做你想要的。

在您的文件中添加此代码。

 //@Author Karl-André Gagnon $.hook = function(){ $.each(arguments, function(){ var fn = this if(!$.fn['hooked'+fn]){ $.fn['hooked'+fn] = $.fn[fn]; $.fn[fn] = function(){ $.fn['hooked'+fn](arguments); $(this).trigger(fn, arguments); } } }) } 

那么这段代码：

 $.hook('remove') 

这是在.remove()上添加一个事件监听器。 不对代码进行任何更改，它将起作用。

一个很小的例子