在<object>中监听滚动事件

Question

我在 HTML 对象标记中有一个PDF，如下所示：

<object type="application/pdf" data="https://termsfeed.com/assets/pdf/privacy-policy-template.pdf"></object>

，当PDF滚动时，我想运行一些代码。但是，将滚动事件侦听器附加到object元素不起作用。使它正常工作的正确方法是什么？

Answer 1

监听容器html元素而不是pdf的滚动事件

<div id='pdfContainer'>
   <object type="application/pdf" data="https://termsfeed.com/assets/pdf/privacy-policy-template.pdf"></object>
</div>

$('#pdfContainer').on('scroll', function () {
        alert('scrolling');
    });

Answer 2

document.getElementById('pdfContainer').addEventListener('scroll', function () {
  console.log('scrolling');
});

object {
  height: 1200px;
}

#pdfContainer {
  height: 500px;
  overflow-y: scroll;
}

<div id='pdfContainer'>
   <object type="application/pdf" data="https://termsfeed.com/assets/pdf/privacy-policy-template.pdf"></object>
</div>