当iframe到达底部时触发函数

Trigger function when bottom of iframe reached

本文关键字：函数 底部 iframe      更新时间：2023-09-26

我有一个动态调整大小的iframe。我用一个post消息和一个监听器在父页面上解决了这个问题，所以每次iframe的内容改变时iframe的大小也会改变，并且永远不会有滚动条。

在iframe中，我显示了一个列表，每次到达iframe的底部时，我想要向列表添加新项。

对于我来说，当到达父页面的底部时，它也可以触发该函数，所以我尝试:

document.getElementById('targetFrame').contentWindow.targetFunction();

但由于跨域起源，

有办法完成我想做的事吗?

感谢大家的支持。

我现在用postmessage解决了这个问题。我实际上认为它只能用于从iframe发布消息到父，但它也以另一种方式工作。

所以把这段代码添加到父javascript中:

document.getElementById('hotellist').contentWindow.postMessage("scroll", "*");

，然后在iframe元素中捕获post消息:

var myEventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
var myEventListener = window[myEventMethod];
var myEventMessage =  myEventMethod == "attachEvent" ? "onmessage" : "message";
myEventListener(myEventMessage, function (e) { 
    if (e.data === "scroll") {
        // Do whatever you want to do
    } 
}, false);
相关文章：