为什么我的滚动事件监听器没有触发？

Question

我正致力于在 Angular 应用中构建无限滚动功能。一次构建一个步骤，目前我在将 eventListener 附加到 #tags-panel-list 的部分，需要检查它的 y 位置。

但是我使用的 eventListener 没有发射任何基本的 console.logs。

Plnkr: http://plnkr.co/edit/7OnKAGvVNXWLwN5fZqJu?p=preview

tagsPanel.html 标记：

<section id="tags-col" class="tag-column column">
    <ul id="tags-panel-list">
        <li ng-repeat="tag in tags">
          <div class="tag">{{tag.term}}</div>
        </li>
    </ul>
</section>

tagsPanelDirective 控制器代码（使用 $timeout 以防 Angular 在第一次加载时看不到 DOM 元素）：

var scrollingElement =  function(event) {
    // I do not see these console logs in the chrome dev inspector
    console.log('scrolling...');
    console.log(event);
};

$timeout(function() {
    document.getElementById('tags-panel-list').addEventListener('scroll', scrollingElement);
}, 250);

Answer 1

实际上是ID为tags-col的元素在滚动：

$timeout(function() {
  document.getElementById('tags-col').addEventListener('scroll', scrollingElement);
}, 250);

Plunker

Answer 2

您还可以在现代浏览器上收听 "wheel"。无论元素如何，这都会拾取滚动。

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

Answer 3

// only this work
document.addEventListener('scroll', function(e) {
  console.log(123);
  console.log($(window).scrollTop());
})

为什么我的滚动事件监听器没有触发？

Why is my scroll eventListener not firing?

javascript

event-listener

dom-events

angularjs