Question

我正在寻找一种非常好的方法来处理元素中的append / remove事件，而不是手动触发事件或类似事件。

这样的事情会很棒：

$('#id').on("append", function() { ... }

提前致谢！

Answer 1

如评论中所述，您可以使用以下内容触发append功能：

(function($) {
    var origAppend = $.fn.append;

    $.fn.append = function () {
        return origAppend.apply(this, arguments).trigger("append");
    };
})(jQuery);

$("div").bind("append", function() { alert('Hello, world!'); });

$("div").append("<span>");

此代码取自此答案： https://stackoverflow.com/a/7167210/2324107

但是因为删除有点不同，因为没有任何参数，你会想要定位元素的父元素。我之前修改了一些代码并得到了这个结果：

var origRemove = $.fn.remove;

$.fn.remove = function () {
    if(arguments.length){
        return origRemove.apply(this, arguments).trigger("remove");
    }else{
        var $parent = this.parent();
        console.log(this)
        origRemove.apply(this, arguments);
        $parent.trigger('remove');
        return this
    }
};

如果有参数，它将触发所选元素。例如，$('body').remove('div');会在remove上触发body个事件。但是如果你写$('div').remove();，它将触发div的父级。

我做了一个小提琴，看一看：http://jsfiddle.net/ZxdU3/

事件监听器将是append和remove。如果您使用任何其他DOM插入函数（after，before甚至appendTo），则不会触发。

jQuery UL追加事件？

1 个答案: