Empfohlene Lektüre:
So beheben Sie das langsame Laden von JS iFrame
In Projekten ist es häufig erforderlich, Iframes dynamisch hinzuzufügen und dann entsprechende Vorgänge für die hinzugefügten Iframes auszuführen Oft wurden die Iframes noch nicht hinzugefügt. Nun, der nachfolgende Code wurde bereits ausgeführt, sodass einige der von Ihnen geschriebenen Dinge überhaupt nicht angezeigt werden. Zu diesem Zeitpunkt müssen wir überlegen, ob wir warten können, bis der Iframe geladen ist, bevor wir weitere Vorgänge ausführen. Natürlich haben verschiedene Browser dies bereits für uns berücksichtigt, siehe unten:
dh Browser
Jeder Elem-Knoten des IE verfügt über ein onreadystatechange-Ereignis. Dieses Ereignis wird jedes Mal ausgelöst, wenn sich der Elem-Inhalt ändert. „Loading“ wird beispielsweise ausgelöst, wenn der Inhalt geladen wird, und „Complete“ wird ausgelöst, wenn der Inhalt geladen wird Wenn der Inhalt erfolgreich geladen wird, muss diese Funktion auch mit readyState zusammenarbeiten, einem Attribut, das jedem Elem im IE gehört und zur Überprüfung des Status jedes Triggers verwendet wird.
//先为iframe 添加一个 onreadystatechange iframe.attachEvent("onreadystatechange", function(){ //此事件在内容没有被载入时候也会被触发,所以我们要判断状态 //有时候会比较怪异 readyState状态会跳过 complete 所以我们loaded状态也要判断 if(iframe.readyState === "complete" || iframe.readyState == "loaded"){ //代码能执行到这里说明已经载入成功完毕了 //要清除掉事件 iframe.detachEvent( "onreadystatechange", arguments.callee); //这里是回调函数 } });
Andere Browser (Firefox, Opera, Chrome usw.)
In anderen Nicht-IE-Browsern haben Iframes wie Firefox, Opera, Chrome usw. ein Onload-Ereignis . Dieses Ereignis muss nur angezeigt werden, wenn es ausgelöst wird. Es besagt, dass der Inhalt geladen wurde.
iframe.addEventListener( "load", function(){ //代码能执行到这里说明已经载入成功完毕了 this.removeEventListener( "load", arguments.call, false); //这里是回调函数 }, false);
Zusammenfassend
if(iframe.attachEvent){ iframe.attachEvent("onreadystatechange", function() { //此事件在内容没有被载入时候也会被触发,所以我们要判断状态 //有时候会比较怪异 readyState状态会跳过 complete 所以我们loaded状态也要判断 if (iframe.readyState === "complete" || iframe.readyState == "loaded") { //代码能执行到这里说明已经载入成功完毕了 //要清除掉事件 iframe.detachEvent("onreadystatechange", arguments.callee); //这里是回调函数 } }); }else{ iframe.addEventListener("load", function() { //代码能执行到这里说明已经载入成功完毕了 this.removeEventListener("load", arguments.call, false); //这里是回调函数 }, false); }
Hinweis: Die obige Funktion muss im Iframe platziert werden, nachdem appendChild an den Text angehängt wurde, andernfalls wird sie nicht ausgelöst
Der obige Inhalt ist klein. Der Editor stellt Ihnen die JS-Methode vor, um festzustellen, ob der Iframe erfolgreich geladen wurde. Ich hoffe, sie wird Ihnen hilfreich sein!
Weitere verwandte Artikel zu Methoden zur Bestimmung, ob ein Iframe basierend auf JS (verschiedene Browser) erfolgreich geladen wird, finden Sie auf der chinesischen PHP-Website!