Jquery Scroll事件未触发

Question

我正在尝试使用class元素触发滚动事件。我试过多个场景，但没有好处。

以下是尝试的事件类型......

jQuery(function($){
     $('[class="ag-body-container"]').bind('scroll',function() {
      alert("hai");
     });
 });

$(document).ready(function(){
        $(".ag-body-viewport-wrapper").bind('scroll',function() {
            alert("hai");
        });
});

$(document).on('scroll', '.ag-body-container', function(){ 
        console.log('scroll happened');
});

$(function() {
     $(".ag-body-container").on('scroll', function () { 
       console.log('scroll happened'); 
      });
});

$(".ag-body-container").bind('scroll', function() {
       console.log('Event worked');
}); 

以上不是预期的结果。

Answer 1

你还没试过

$(document).ready(function(){
    $(document).on('scroll', '.ag-body-container', function(){ 
        console.log('scroll happened');
    });
});

OR

 $(document).ready(function(){
    $(window).on('scroll', '.ag-body-container', function(){ 
        console.log('scroll happened');
    });
});

Answer 2

  

尝试.on代替.bind，或者您可以使用.scroll。

因为，.bind可能会在以后的版本中被删除。没有理由继续使用.bind和所有理由更喜欢.on。

请参阅jquery .bind() vs. .on()

Answer 3

当用户滚动指定的元素时，会发生滚动事件。

scroll事件适用于所有可滚动元素和窗口对象（浏览器窗口）。

如果窗口可滚动，则会触发以下代码。

 $(function() {
     $(window).on('scroll', function () { 
       console.log('scroll happened'); 
      });
});

但如果你想尝试这样的话。

 $(".ag-body-container").on('scroll', function () { 
       console.log('scroll happened'); 
      });

如果＆＃39; .ag-body-container＆＃39; 标识的元素可滚动，则只会触发事件。

检查plunker：http://plnkr.co/edit/QCMSsfGgggjaHVWDdNp9?p=preview