javascript - 到达 iframe 底部时触发函数

Question

我有一个可以动态调整其大小的 iframe。我通过父页面上的发布消息和监听器解决了这个问题，因此每次 iframe 的内容发生变化时，iframe 的大小也会发生变化，并且永远不会有滚动条。

在 iframe 中，我显示了一个列表，每次到达 iframe 的底部时，我都想将新项目附加到列表中。

对我来说，它也可以在到达父页面底部时触发该功能，所以我尝试了:

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

但由于跨域来源是被禁止的。

有没有办法完成我想做的事情？

Answer 1

感谢您的意见。

我现在使用 postmessage 解决了它。我实际上认为它只能用于从 iframe 向父级发布消息，但它也可以以其他方式工作。

所以只需将此代码添加到父 javascript 中:

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

然后在 iframe 元素中捕获发布消息:

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);