Comment vérifier de manière fiable si un IFrame est chargé et prêt à interagir en JavaScript ?

Comment vérifier si un IFrame est chargé ou a du contenu

Lorsque vous traitez des iframes dont le chargement peut prendre plus ou moins de temps, il devient nécessaire de déterminer leur état de chargement. Cet article présente une solution fiable pour vérifier si une iframe est chargée ou a du contenu.

Le code fourni utilise la fonction setTimeout de JavaScript pour vérifier périodiquement l'état de l'iframe. La clé ici réside dans la fonction checkIframeLoaded, qui utilise une approche récursive pour vérifier en permanence la propriété readyState de l'iframe.

Si le processus de chargement est terminé, comme indiqué par une valeur readyState de "complete", la fonction afterLoading est appelée. Cette fonction effectue les actions souhaitées après le chargement de l'iframe.

Voici l'extrait de code :

<code class="javascript">function checkIframeLoaded() {
    // Get iframe element
    var iframe = document.getElementById('i_frame');
    var iframeDoc = iframe.contentDocument || iframe.contentWindow.document;

    // Check loading status
    if (iframeDoc.readyState == 'complete') {
        // Loading complete, call afterLoading function
        afterLoading();
        return;
    } 

    // Not loaded, check again in 100 milliseconds
    window.setTimeout(checkIframeLoaded, 100);
}

function afterLoading(){
    alert("Iframe loaded");
}</code>

Pour utiliser cette solution, incluez simplement le code dans votre balise body HTML ou appelez checkIframeLoaded manuellement lorsque l'iframe est prêt à être chargé. Cette approche gère efficacement les différents temps de chargement de l'iframe et vous permet d'effectuer des actions une fois que l'iframe est entièrement chargée ou contient du contenu.

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!