：循环，直到readyState完成

Question

我想知道为什么这个简单的代码循环永远存在？

var iBody=document.getElementsByTagName('body')[0];

d=document.createElement('iframe');
d.src='http://m.puaction.com';
d.id="myiFrame";
iBody.appendChild(d);

while(document.getElementById('myiFrame').readyState!=='complete')
{
    //do nothing;
}

alert('iFrame fully loaded');

基本上，我想确保它已经完全加载，然后检查它是否完全可见(另一个while循环？)

Answer 1

我通过Google找到了以下链接：http://wpapi.com/check-iframes-loaded-completely-browser/

不知道它是否解决了“页面找不到”的问题。

<script type="javascript">
var iframe = document.createElement("iframe");
iframe.src = "http://www.your_iframe.com/";
if (navigator.userAgent.indexOf("MSIE") > -1 && !window.opera) {
  iframe.onreadystatechange = function(){
    if (iframe.readyState == "complete"){
      alert("Iframe is now loaded.");
    }
  };
} else {
  iframe.onload = function(){
    alert("Iframe is now loaded.");
  };
}
</script>

我自己也没试过，所以我不知道它是否管用。祝好运!

在你的情况下，你不需要检查你的状态，

更好的实现方法是

document.getElementById('myIframe').onreadystatechange = MyIframeReadyStateChanged;

function MyIframeReadyStateChanged()
{
    if(document.getElementById('myIframe').readyState == 'complete')
    {
        alert("Iframe is now loaded.");
    }
}

和微小的短而甜蜜的jQuery代码是

$('#iframe').on('load', iframeLoaded);

同步行为

function restOfTheCode(){
// Having your whole rest of the code
}

现在只做restOfTheCode()而不是alert("IFrame is loaded")。

Answer 2

使用addEventListener函数

iframe.addEventListener("readystatechange", () => {
    if (iframe.readyState == "complete") {
        alert("Iframe is now loaded.");
    }
});