Question

我在滚动事件方面遇到了一些麻烦。

我正在尝试将事件附加/绑定到特定的div，由于这个事实，我正在使用$('body').on()来做这件事在排序时重新加载内容，因此它将失去其绑定。

这不起作用，事件未被触发：

$('body').on('scroll', 'div.dxgvHSDC + div', function () {
}

这另一方面起作用：

$('body').on('mousewheel DOMMouseScroll', 'div.dxgvHSDC + div', function () {
}

这也是：

$('div.dxgvHSDC + div').on('scroll', function () {
}

有什么问题？

Answer 1

您无法将委派添加到scroll事件中。此事件不会冒泡DOM，因此您无法将其委托给任何元素。您可以找到更多信息here：

滚动事件不会冒泡。

虽然事件没有冒泡，但当用户滚动整个页面时，浏览器会在文档和窗口上触发滚动事件。

您需要在创建滚动元素的事件中创建事件处理程序。

活生生的例子：http://jsfiddle.net/Um5ZT/1/

$('#link').click(function(){

    //dynamically created element
    $('body').append('<div class="demo"></div>');

    //dynamically added event
    $('.demo').on('scroll', function () {
        alert('scrolling');
    });

});

Answer 2

在现代浏览器（IE> 8）上，您可以将scroll事件捕获到动态元素的document级别。由于jQuery没有实现捕获阶段，您必须使用javascript addEventListener()方法：

document.addEventListener(
    'scroll',
    function(event){
        var $elm = $(event.target);
        if( $elm.is('div.dxgvHSDC + div')){ // or any other filtering condition
            // do some stuff
            console.log('scrolling');
        }
    },
    true // Capture event
);

将滚动事件附加到div与body on（）绑定失败

2 个答案: