爲什麼jQuery的這些嵌套觸發器不起作用？

Question

我正在使用下面的代碼來加載兩個underscore.js模板。點擊第一個鏈接後，加載框架模板。第一個觸發器執行find bind，它正確地執行loadBookmarks函數，但'loaded'觸發器永遠不會觸發並且loadFriendBookmarks永遠不會執行。爲什麼是這樣？是否有另一種方法來實現這一點？

$('#bookmarks-link').click(function() { 
    $('#bookmarks-count').text("0"); 
    var skeleton = modalTemplate(); 
    $('#bookmarks').append(skeleton); 
    $('#bookmarks').trigger('skeleton'); 
}); 

$('#bookmarks').bind('skeleton', function() { 
    $('#bookmarks .thumbnails').loadBookmarks(getBookmarksUrl(1)); 
    // If I add an alert('hi') here, it works perfectly. 
    $('#bookmarks').trigger('loaded'); 
}); 

$('#bookmarks').bind('loaded', function() { 
    $('#bookmarks .thumbnails a').each(function() { 
    $(this).bind('click', function() { 
     $('#bookmarks .bookmarks-table tbody').empty(); 
     $('#bookmarks .bookmarks-table tbody').loadFriendBookmarks(
     getFriendBookmarksUrl($(this).attr('data-item')) 
    ); 
    }); 
    }); 
}); 

所以足夠有趣，觸發器都正常工作：如果我在loadBookmarks和觸發之間堅持一個警告，一切工作正常。如果我把它拿出來，那麼它不會。任何想法爲什麼？

Answer 1

工作，這聽起來像來自遠程源loadBookmarks()加載數據，如Ajax調用。這意味着trigger('loaded')可以在之前觸發loadBookmarks()已收到數據。您可以添加一個回調參數loadBookmarks()和有觸發事件：

$('#bookmarks .thumbnails').loadBookmarks(getBookmarksUrl(1) , function() { 
    $('#bookmarks').trigger('loaded'); 
}); 

但是這需要你loadBookmarks知道它接收到的數據，並創建所需的HTML後調用此函數 - 不，我不能證明這一點看到loadBookmarks中的實際代碼。

---

其它建議：不綁定處理這種方式，使用event delegation代替：

$('#bookmarks').on('click', '.thumbnails a', function(e) { 
    e.preventDefault(); // don't want the link to actually be followed, do we 
    var url = getFriendBookmarksUrl($(this).attr('data-item')); 
    if(url) { // in case it's clicked before the data attribute is set 
    var $tbody = $('#bookmarks .bookmarks-table tbody'); 
    $tbody.empty(); 
    $tbody.loadFriendBookmarks(url); 
    } 
}); 

這意味着所有元素選擇匹配「#bookmarks .thumbnails一個」會調用這個點擊處理程序，即使它們被添加到文件之後您稱爲on。這意味着即使在致電loadBookmarks之前，您也可以委派這些活動，完全不需要loaded活動。另外，這樣你只有一個處理函數的副本在內存中，而不是你的bind，它爲每個a節點創建了一個單獨的函數副本。

Answer 2

問題是在你的代碼中的其他地方。可能在loadBookmarks*函數中有些js錯誤。

看到：根據您的描述和常識

http://jsfiddle.net/BBESV/

觸發完美