性能：jquery.live（）與按需創建特定偵聽器？

Question

我有一個新聞項目標題的頁面，點擊每一個阿賈克斯加載一個完整的新聞項目，包括照片縮略圖。我想附上一個燈箱縮略圖顯示一個更大的照片。

我有兩個選擇（我認爲）：

1. .live（）

。

$('img .thumb').live('click', function()) 

添加在新聞項目的回叫的特定ID基於聽者單擊

。

$('div.news_item').click(function(){ 
    var id = $(this).attr('id'); 
    //click 
    show_news_item(), 
    //callback 
    function(){$(id+' .thumb').lightbox();} 
}) 

Answer 1

在.live()你有1個聽衆，而不是束縛n事件監聽器，所以這通常是一個雙贏就在那裏，只要你有：

1. 大量元素，或者動態創建/加載的元素
2. 嵌套在DOM不太深，或者是但你有一個很多元素（這裏的成本/效益比）

在你的情況我會使用.live()，像這樣：

$('div.news_item').live('click', function(){ }); 

或者，如果您class="news_item"元素是在一個容器中，你可以選擇這樣的：

<div id="newsItems"> 
    <div class="news_item">News 1</div> 
    <div class="news_item">News 2</div> 
</div> 

您可以使用.delegate()這樣（甚至更高效，更少事件冒泡DOM）：

$("#newsIems").delegate(".news_item", "click", function() { }); 

注意：你函數中的代碼是仍然相同，$(this)仍然指向與這些選項中的任何一個相同的元素。