使用jQuery處理新元素的添加

頁面包含文章列表。點擊「更多」按鈕，更多文章將通過AJAX加載使用jQuery處理新元素的添加

我需要使新增文章順利出現。

我可以用jQuery.fadeIn（）方法做到這一點。

問題是 - 如何處理這樣的事件，當新的元素被添加到問題的jQuery元素。

我不想在服務器上調用自定義JavaScript方法。服務器端對於任何樣式功能都必須很弱。

因此，代碼在服務器端必須是乾淨的 - 它必須使用jQuery.append（）方法添加新元素。

在客戶端，它應該是這樣的：

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

「elementAdded」是一種方法，我在找。

怎麼辦？

在此先感謝。

來源

2010-11-20 AntonAL

你的問題是關於一個elementAdded事件，這將更好地稱爲dommodified事件，國際海事組織。這些在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);

然後，您可以通過綁定到contentappended事件捕捉append()修改：

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

來源

2010-11-20 12:21:49 lonesomeday

謝謝，我明白這個主意。 – AntonAL 2010-11-20 13:24:31

服務器不會調用append，所有的javascript都在客戶端執行。只需在添加新元素的位置調用jQuery.fadeIn（）。

來源

2010-11-20 11:59:36 GolezTrol

是的，你是right.I平均值，即JS代碼（添加文章），這將通過XHR提供，我寫在服務器文件中。我應該避免它。 – AntonAL 2010-11-20 12:22:31

使用jQuery處理新元素的添加

回答

相關問題