Comment déterminer si le chargement de l'iframe est terminé

Comment juger quand le chargement d'une iframe est terminé : exemple de code

Dans le développement Web, lorsque des pages externes ou d'autres pages Web doivent être chargées, la balise iframe est souvent utilisée. Cependant, nous devons parfois effectuer certaines opérations après le chargement de l'iframe, comme obtenir le contenu de l'iframe ou exécuter du code JavaScript. Par conséquent, juger que l’iframe est chargé est une tâche très importante.

Ci-dessous, je partagerai plusieurs méthodes pour déterminer si l'iframe est chargée et fournirai des exemples de code spécifiques.

1. Utilisez l'événement onload de l'iframe
   La balise iframe fournit un événement onload, qui sera déclenché lorsque le contenu de l'iframe est chargé. Nous pouvons déterminer si l'iframe est chargée en intégrant une iframe cachée dans la page et en écoutant son événement onload.

Code HTML :

<iframe id="myIframe" src="external.html" style="display:none;"></iframe>

Code JavaScript :

var iframe = document.getElementById("myIframe");
iframe.onload = function() {
  // iframe加载完成后执行的操作
  console.log("iframe加载完成");
};

2. Utilisation de l'attribut contentWindow d'iframe
   Grâce à l'attribut contentWindow d'iframe, nous pouvons obtenir l'objet fenêtre de la page intégrée. En utilisant cet objet, nous pouvons déterminer si le document dans l'iframe a été chargé.

Code HTML :

<iframe id="myIframe" src="external.html"></iframe>

Code JavaScript :

var iframe = document.getElementById("myIframe");
var iframeWindow = iframe.contentWindow;

var checkIframeLoaded = function() {
  if (iframe && iframe.contentDocument.readyState === 'complete') {
    // iframe加载完成后执行的操作
    console.log("iframe加载完成");
  } else {
    // 等待iframe加载完成
    setTimeout(checkIframeLoaded, 100);
  }
};

checkIframeLoaded();

3. Utiliser la méthode ready de jQuery
   Si la bibliothèque jQuery est utilisée dans le projet, vous pouvez utiliser la méthode ready qu'elle fournit pour déterminer que l'iframe est chargée.

Code HTML :

<iframe id="myIframe" src="external.html"></iframe>

Code JavaScript :

$(document).ready(function() {
  $('#myIframe').on('load', function() {
    // iframe加载完成后执行的操作
    console.log('iframe加载完成');
  });
});

Vous trouverez ci-dessus plusieurs méthodes et exemples de code pour déterminer quand le chargement de l'iframe est terminé. Sélectionnez la méthode appropriée en fonction de la situation réelle pour surveiller et traiter l'événement de fin de chargement de l'iframe. J'espère que cet article vous sera utile pour juger si l'iframe est chargé !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!