我在 iframe 中有一个 pdf 文件。我希望用户在提交表单之前必须在 pdf 文件中滚动。我正在尝试这个，
var position = $('#myIframe').contents().scrollTop();
但不工作。请帮助我提前谢谢。
【问题讨论】：
标签： javascript jquery
如果您不介意为 iframe 制作静态高度，我可以为您提供解决方案。
HTML 和 CSS
1. 将您的 iframe 包装在 div 容器中
2. 为您的容器和 iframe 设置heights（容器的height 应该是您希望看到您的框架的height，并且iframe height 应该足够大以显示整个pdf。）
3.设置容器div的overflow为scroll
现在您有了一个可滚动的“iframe”。
JavaScript
var containerEl = $("#container")[0];)scroll函数。在滚动函数中查找元素的总高度 (scrollHeight) 是否小于或等于已滚动的高度 (scrollTop) 加上内部高度 (clientHeight)
元素。如果是，请从 button 中删除 disabled 属性
这是fiddle。对@mJunaidSalaat 的 jsfiddle 进行了一些更改。
【讨论】：
好吧，我已经尝试了将近一个小时，研究了它，最后得出结论，不幸的是这是不可能的使用这种方法。
PDF 通常不是 DOM 元素，它是由 PDF 阅读器软件呈现的。每个浏览器都有自己的 PDF 渲染机制，没有标准。在某些情况下，PDF 可能由 PDF.js 呈现；在这些情况下，您可能能够检测到滚动。但 Adobe Reader、Foxit 和一些原生 PDF 渲染不提供该选项。
我还为此创建了一个 Github issue。但是没用。
对不起。如果您能找到任何东西或任何解决方法，请更新我。
【讨论】：
我已为您的解决方案创建了Fiddle。您可以禁用用户的提交按钮，直到用户在您的 iframe 上滚动。
function getFrameTargetElement(objI) {
var objFrame = objI.contentWindow;
if (window.pageYOffset == undefined) {
objFrame = (objFrame.document.documentElement) ? objFrame.document.documentElement : objFrame = document.body;
}
return objFrame;
}
$("#myIframe").ready(function() {
var frame = getFrameTargetElement(document.getElementById("myIframe"));
frame.onscroll = function(e) {
$('.submitBtn').prop('disabled', false);
}
});
希望对你有帮助。
【讨论】：
试试这个
$("#myIframe").ready(function() {
var frame = getFrameTargetElement(document.getElementById("myIframe"));
frame.onscroll = function(e) {
$('.submitBtn').prop('disabled', false);
}
});
【讨论】：