Comment puis-je détecter si une iframe est chargée ?

Question

Comment puis-je détecter si une iframe est chargée ?

Demandé el 4 de Septembre, 2012: Quand la question a-t-elle été
296982 affichage: Nombre de visites la question a
3 Réponses: Nombre de réponses aux questions
Résolu: Situation réelle de la question

J'essaie de vérifier si un iframe a été chargé après que l'utilisateur ait cliqué sur un bouton.

J'ai

$('#MainPopupIframe').load(function(){
    console.log('load the iframe')
    //the console won't show anything even if the iframe is loaded.
})

HTML

<button id='click'>click me</button>

//the iframe is created after the user clicks the button.
<iframe id='MainPopupIframe' src='http://...' />...</iframe>

Des suggestions ?

Au fait, mon iframe est créé dynamiquement. Il ne se charge pas lors du chargement initial de la page.

Demandé el 4 de Septembre, 2012 par Rouge

Answer 1

3 Réponses

Answer 2

188voto

WereWolf - The Alpha Points 49671

Vous pouvez essayer ceci (en utilisant jQuery )

$(function(){
    $('#MainPopupIframe').load(function(){
        $(this).show();
        console.log('iframe loaded successfully')
    });

    $('#click').on('click', function(){
        $('#MainPopupIframe').attr('src', 'https://heera.it');    
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id='click'>click me</button>

<iframe style="display:none" id='MainPopupIframe' src='' /></iframe>

jsfiddle DEMO .

Mise à jour : Utilisation de l'ordinaire javascript

window.onload = function(){
    var ifr = document.getElementById('MainPopupIframe');
    ifr.onload=function(){
        this.style.display='block';
        console.log('laod the iframe')
    };

    var btn = document.getElementById('click');    
    btn.onclick=function(){
        ifr.src='https://heera.it';    
    };
};

<button id='click'>click me</button>

<iframe style="display:none" id='MainPopupIframe' src='' /></iframe>

jsfiddle DEMO .

Mise à jour : Vous pouvez aussi essayer ceci (iframe dynamique)

$(function(){
    $('#click').on('click', function(){
        var ifr = $('<iframe/>', {
            id:'MainPopupIframe',
            src:'https://heera.it',
            style:'display:none;width:320px;height:400px',
            load:function(){
                $(this).show();
                alert('iframe loaded !');
            }
        });
        $('body').append(ifr);    
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id='click'>click me</button><br />

jsfiddle DEMO .

Répondu el 4 de Septembre, 2012 par WereWolf - The Alpha (49671 Points )

Answer 3

2voto

Desislav Kamenov Points 802

Je l'imagine comme ça :

<html>
<head>
<script>
var frame_loaded = 0;
function setFrameLoaded()
{
   frame_loaded = 1;
   alert("Iframe is loaded");
}
$('#click').click(function(){
   if(frame_loaded == 1)
    console.log('iframe loaded')
   } else {
    console.log('iframe not loaded')
   }
})
</script>
</head>
<button id='click'>click me</button>

<iframe id='MainPopupIframe' onload='setFrameLoaded();' src='http://...' />...</iframe>

Répondu el 4 de Septembre, 2012 par Desislav Kamenov (802 Points )

Answer 4

2voto

Teoman shipahi Points 7988

Vous pouvez également essayer l'événement onload ;

var createIframe = function (src) {
        var self = this;
        $('<iframe>', {
            src: src,
            id: 'iframeId',
            frameborder: 1,
            scrolling: 'no',
            onload: function () {
                self.isIframeLoaded = true;
                console.log('loaded!');
            }
        }).appendTo('#iframeContainer');

    };

Répondu el 7 de Décembre, 2017 par Teoman shipahi (7988 Points )

Comment puis-je détecter si une iframe est chargée ?

Réponses

Questions en vedette

Top Tags

Prograide.com

Powered by:

Comment puis-je détecter si une iframe est chargée ?

Réponses

Questions en vedette

Top Tags

Dans notre réseau

Prograide.com

Powered by: