Question

我有以下观点

var FullWindow = Backbone.View.extend({
  initialize: function() {
    _.bindAll(this, 'detect_scroll');
  },

  // bind the events
  events : {
    "scroll" : "detect_scroll"
  },

  detect_scroll: function() {
    console.log('detected');
  }
});

我通过

初始化它

var full_window = new FullWindow({el:$('body')});

但我不认为它有效。

当我将事件更改为

时

events : {
  "click" : "detect_scroll"
},

没关系。

怎么了？

Answer 1

我不认为body元素会触发滚动事件，除非您通过在CSS中将其overflow属性设置为scroll来明确地为其指定滚动条。来自jQuery文档：

当用户滚动到元素中的其他位置时，滚动事件将发送到元素。它适用于窗口对象，也适用于可滚动框架和元素，其中溢出CSS属性设置为滚动（或当元素的显式高度或宽度小于其内容的高度或宽度时自动）。

假设您没有明确地为body元素提供带有overflow:scroll和/或固定高度的滚动条，那么您想要侦听的scroll事件可能会被触发window对象，而不是body。

我认为这里最好的方法是删除Backbone事件绑定（这只是一个简写，只适用于view.el元素中的事件）并直接绑定到initialize()中的窗口：

initialize: function() {
    _.bindAll(this, 'detect_scroll');
    // bind to window
    $(window).scroll(this.detect_scroll);
}

Answer 2

我认为问题在于Backbone使用事件委派来捕获事件，即它将侦听器附加到this.$el，并且scroll事件不会按定义冒泡。因此，如果scroll的子（或后代）发生this.$el事件，则this.$el无法观察到此事件。

它适用于click的原因，只是因为click冒泡。

Answer 3

正文和窗口的滚动条不同，您必须确保不在窗口对象上滚动。这是一个jsfiddle，说明了您可能遇到的问题。

jsfiddle

我不确定你是否可以将'el'更改为document.window对象，但我认为无论如何这都不是一个好的解决方案。我想说你最好的选择是使用CSS，就像我已经做过的那样，帮助你使用body元素或者在body中创建一个div并引用body标签。

祝你好运。

Answer 4

我有同样的问题，这就是我实施它的方式

var MyView = Backbone.View.extend({
el: $('body'),
initialize: function() {
    $(window).scroll(function() {
        if ($(window).scrollTop()!=0 && $(window).scrollTop() == $(document).height() - $(window).height()) {
            if (mpListModel.get('next')) {
                var res = confirm('Next page?');
                if (res==true) {
                    myView.fetch()
                }
            }
        }
    });
},
events: {},
fetch: function() {
    //fetch stuff
}

}）; var myView = MyView（）;

Answer 5

afterRender: function() {
    // <div id="page-content" class="page-content"> la class qui contiens le scroll
    var $scrollable = this.$el.find('.page-content'); 
    $scrollable.scroll(function() {
           alert("event scroll ");
    });
},

Backbone.js检测滚动事件

5 个答案: