Question

页面包含文章列表。单击“更多”按钮，将通过AJAX加载更多文章

我需要让新添加的文章顺利出现。

我可以使用jQuery.fadeIn（）方法。

问题是 - 当新元素被添加到有问题的jQuery元素时，如何处理这样的事件。

我不想在服务器上调用自定义JavaScript方法。关于任何样式功能，服务器端必须是弱的。

因此，代码必须在服务器端清理 - 它必须使用jQuery.append（）方法添加新元素。

在客户端，它应该是这样的：

$("#articles").elementAdded(function(newElem){
   newElem.hide();
   newElem.fadeIn(600);
});

“elementAdded”是一种方法，我正在寻找。

怎么做？

-

提前致谢。

Answer 1

您的问题是elementAdded事件，更好地称为dommodified事件，即IMO。这些在Javascript中不存在，尽管我认为jQuery应该模仿它们。这在理论上并不难：

(function($, undefined) {
    var _append = $.fn.append;

    $.fn.append = function(newHtml) {
        return this.each(function(i, el){
            var $el = $(el);
            _append.call($el, newHtml);
            $el.trigger('contentappended');
        });
    };
})(jQuery);

然后，您可以通过绑定append()事件来捕获contentappended的修改：

$('#articles').bind('contentappended', function() {
    $(this).hide().fadeIn(600);
});

Answer 2

服务器不调用append，所有javascript都在客户端上执行。只需在添加新元素的位置调用jQuery.fadeIn（）。

使用jQuery处理新元素的添加

2 个答案: