How to know if the iFrame has completed loading with javascript

Question

I would like to know which callback to use when the iframe has completed loading.


const iFrame = window.parent.document.getElementById('ReviewGeologueFrame'); 

iFrame.src = `/Review/GeologueFrame?id=${str}`;

iFrame.onreadystatechange = function (){

            if (iFrame.readyState !== 'loading')
            {
                console.log('iFrame has completed loading');

            }


}

When i tried the above snippet, there is no message in the console; what am doing wrong

"If I Recall Correctly". Try adding an event listener for the `load` event on the iframe. — Taplar, Aug 20 '19 at 20:48
`iframe.onload = function(){/* your stuff here */};` onload is your friend — Ibu, Aug 20 '19 at 21:28

score 0 · Answer 1 · answered Aug 20 '19 at 21:26

0

You could always try using some jquery.

$('iframe').on('load', function () {
console.log('iFrame has completed loading'); });

This works for me. You might also want to look here. It is another Stackoverflow page where they discuss the same issue.

answered Aug 20 '19 at 21:26

jcasas5253

1
1

How to know if the iFrame has completed loading with javascript

1 Answers1