检测用户是否滚动到嵌入式 pdf 的底部

Question

我一直在努力获得一个“继续”按钮，以显示用户何时滚动到页面上嵌入的 PDF 文件的底部。到目前为止，我已经阅读了几个线程，这些线程基本上都在说没有真正的方法来确定使用 embed/object 标签嵌入的 pdf 的底部位置。

我尝试构建一个非常简单的脚本来在用户到达文档底部时登录控制台，但这似乎没有任何作用。

$(function () {
        $('#contractPDF').bind('scroll', function(e) {
                if($(this).scrollTop() + $(this).innerHeight()>=$(this)[0].scrollHeight)
            {
                console.log('End of document');
            }
        });

#contractPDF 位于这样的容器中：

<embed id="contractPDF" class="pdf" width="800" height="600" src="/images/example.pdf" type="application/pdf"></embed>

有没有人有更好的解决方案，或者我应该考虑使用 pdf.js 之类的东西吗？

Answer 1

嵌入

当您使用嵌入显示 PDF 时，您当然无法控制浏览文档的状态。您只能设置页面或缩放等初始值，完整列表请参见此处Parameters for Opening PDF Files。所有的渲染都由浏览器中的 PDF 插件处理。

PDF.js

如果您打算使用 PDF.js，那么您可以使用 PDF viewer by PDF.js team，它经过了很好的优化和高度可定制。也适用于非常基本的自定义查看器using PDF.js can be found here。