检测到 iFrame 已加载后或超时 3 秒后调用函数

Question

我想在我网页的隐藏 iframe 中加载外部 URL。我需要检测外部 URL 完成加载后，然后调用我的函数 MyFunct()。如果外部 URL 加载时间超过 3 秒，我需要超时并调用 MyFunct()

以下代码是否会在 iframe 加载后或由于超时 3 秒后调用我的函数 MyFunct()？

var iframe = document.getElementById('MyFrame');
iframe.src = "SomeRandonUrl";

iframe.onload = function () {
   setTimeout(MyFunct, 3000);
}

Answer 1

您应该检查它是否已在超时事件中加载，如下所示。

var iframe = document.getElementById('MyFrame');
iframe.src = "SomeRandonUrl";

iframe.onload = function () {
    if (iframe.src !== "about:blank")
        iframe.loaded = true; // set that it has loaded if not about:blank
}

setTimeout(function() {
    if (!iframe.loaded) { // if undefined or false valued
        alert('Timedout');
        // and then you can cancel it's loading setting another src for e.g
    }
}, 3000);

检测到 iFrame 已加载后或超时 3 秒后调用函数

Call function after detecting iFrame has loaded, or after 3 second timeout

javascript

iframe

settimeout