代码之家 › 专栏 › 技术社区 › rwkiii

使用srcdoc时未触发iframe scroll事件=

jquery javascript

rwkiii · 技术社区 · 6 年前

我使用iframe来显示html文档。我需要检测iframe中的滚动事件。使用src=可以正常工作,但srcdoc=不会触发滚动事件。

HTML格式:

<iframe id="TermsConditionsText" srcdoc="<!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.1//EN&quot; &quot;http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd&quot;><html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;><head><meta http-equiv=&quot;Content-Type&quot; content=&quot;application/xhtml+xml; charset=utf-8&quot; /><title></title></head><body><div class=&quot;Section0&quot;> ... </div></body></html>" class="form-control" style="overflow-y: scroll; height: 600px;"></iframe>

jQuery(document).ready(function () {
    var termsWereScrolled = false;

    $("#TermsConditionsText").scroll(function () {
        if (termsWereScrolled) return true;

        if ($(this).scrollTop() + $(this).innerHeight() + 2 >= $(this)[0].scrollHeight) {
            termsWereScrolled = true;
        }
    });
});

使用srcdoc=时iframe是否触发滚动事件?

1 回复 | 直到 6 年前

lenilsondc 6 年前

使用srcdoc=时iframe是否触发滚动事件?

是的,使用时确实会触发滚动事件 srcdoc .

那东西 iframe 它是一个新窗口,并且有自己的文档;因此,必须将事件附加到它的文档,而不是元素本身。尽管如此,您只需查询 框架 $("#TermsConditionsText").contents() 附加事件。看看这个:

var iframeContents = $("#TermsConditionsText").contents();

$(iframeContents).scroll(function () {
    console.log('scroll');

    var html = $(this)[0].scrollingElement;
    console.log('scrollHeight', html.scrollHeight);
});

推荐文章

Newbie_Coder · 如何使用Jquery无画布裁剪框架

1 年前

usman610 · Javascript代码在点击回车键和点击按钮时删除行

1 年前

NovoMannen · 导航中的下拉菜单在内容后面重叠

1 年前

Carly · 在页面加载时滑入div,然后单击以滑入和滑出(jQuery)

1 年前

Community wiki · jquery弹出窗口不会用按键关闭,但会点击

1 年前

Community wiki · Smarty IE9请求下载index.php文件(在上传未发生后)?是我的代码出错还是activecollab?

1 年前

Community wiki · 无法从jquery文档调用函数

1 年前

marzouk najib · Uncaught ReferenceError:未定义FullCalendar

2 年前

Pepe · 检查“data”属性是否包含输入值的一部分(jQuery)

2 年前

laurence keith albano · 如何使用Jquery在父类内添加子父类

2 年前