div上的捕獲滾動事件

Question

我想捕獲Backbone.Marionette.CompositeView中的滾動事件，但沒有成功。

作爲練習，我正在使用Backbone.Marionette重寫http://www.atinux.fr/backbone-books/。正如您所看到的，當您向下滾動時，會獲取並顯示更多書籍（即無限滾動）。但是，我無法捕捉到我的視圖上的滾動事件。

這是我（簡化）代碼：

LibraryView = Backbone.Marionette.CompositeView.extend({ 
    // properties, initializer, etc. 

    events: { 
     'scroll': 'loadMoreBooks', 
     'click': 'loadMoreBooks' 
    }, 

    // some functions 

    loadMoreBooks: function(){ 
     console.log("loadMoreBooks"); 
    } 
    }); 

完整的源代碼可以在這裏看到：https://github.com/davidsulc/backbone.marionette-atinux-books/blob/scroll/assets/javascript/app.js#L86-89

我不明白的是，「點擊」事件被正確觸發，但「滾動」事件不是。我究竟做錯了什麼？

---

編輯：這樣的錯誤是在年底很簡單......我是路過「EL：＃內容」到視圖的構造器，但滾動在CSS定義的「.library」。所以一旦我改變了我的DOM從

<div id="content"> 
    <div class="library"> 
    </div> 
</div> 

到

<div id="content" class="library"></div> 

一切工作正常...

Answer 1

此代碼的工作對我來說：

var View = Backbone.View.extend({ 
    events: { "scroll": "scroll" }, 
    scroll: function(){ console.log("scrolling..."); } 
}); 

Check the jsFiddle

正如@JoshLeitzel說，我認爲這個問題是在DOM元素，它的自我。

嘗試旁路骨幹做：

$("#content").bind("scroll", function(){ console.log("scrolling from jquery directly"); }); 

而且試圖取代：

el: $('#content') 

通過

el: '#content' 

我不認爲這是問題，但el定義的新款式:)

Answer 2

我不知道你的el是什麼，但我懷疑它的東西，不收到scroll事件。由於骨幹代表事件處理jQuery的，看看有什麼jQuery的說對scroll event：

的scroll事件被髮送到一個元素，當用戶滾動到的元素的 不同的地方。它適用於window對象，而且 可滾動框架和元素的overflow CSS屬性集 滾動（或auto當元素的顯式高度或寬度小於 比其內容的高度或寬度）。

除非你el滿足這些條件，也不會收到scroll事件。您將不得不將事件處理程序放在window或其他一些接收它的元素上。

Answer 3

骨幹連接頂部el元素查找全部事件。一些DOM事件沒有冒泡到父元素，這包括滾動。點擊事件起作用，因爲它確實起泡。

價：http://www.w3.org/TR/2009/WD-DOM-Level-3-Events-20090908/#event-type-scroll