附加到div时，scroll（）事件未触发

Question

<div class="row">
    <div class="col-md-8" id="homeview-story"></div>
    <div class="col-md-4" id="homeview-stream">
        <div id="log"></div>
    </div>
</div>

<div class="row">
    <div class="col-md-8" id="homeview-story"></div>
    <div class="col-md-4" id="homeview-stream">
        <div id="log"></div>
    </div>
</div>

#homeview-story {
    overflow: scroll;  
    width: 72%; 
    height: 800px;
}
#homeview-stream { 
    overflow: scroll;  
    width: 28%; 
    height: 800px;
}

目标是对两者homeview-story和homeview-stream分别实现无限滚动以加载各自的数据。滚动功能适用于窗口obj（$(window).scroll），但不适用于特定的div。

Answer 1

"scroll"仅当元素实际可滚动/滚动时才有效。如果你想滚动数据而不考虑元素大小，"wheel"如果你的浏览器支持，你可以使用它。

document.addEventListener("wheel", function(event) {
    console.log(event);
});

Answer 2

问题是，#homeview-story没有溢出，所以它没有滚动。首先，它应该有一些大于滚动的内容，这是您的代码中缺少的。

这是一个Demo，其中#logo的高度大于它的父级#homeview-stream，我们正在听它的滚动。