Jquery - Sequence Of Page Load(?) Issue

EDIT: Fixed as follows, simply hide the iframe by setting height and width to zero: var frmurl ='http:/

Solution 1:

Loading an IFRAME is asynchronous. You may be able to do what you want like this:

jQuery(function($){
        $('#frm').attr('src', frmurl).load(function() {
            var doc = $(this)[0].contentDocument;
            $(doc.body).html('This text should replace the BBC website');
        });  
});

This waits until the IFRAME is loaded, then tries to modify it.

However, I'm not sure this will be allowed -- you're not allowed to manipulate the contents of an IFRAME loaded from a different domain.

UPDATE:

I was right, it doesn't work. I tried this fiddle and the console logs:

Blocked a frame with origin "http://fiddle.jshell.net" from accessing a frame with origin "http://www.bbc.co.uk". Protocols, domains, and ports must match.

You're not allowed to do what you're trying to do.

Solution 2:

Updating the <iframe> "src" property is basically an explicit request that the browser update the frame with the content fetched from the given URL. Thus, it doesn't really make sense to ask that the browser both do that and not do that :)

What you can do, however, is put your message somewhere else instead of in the <iframe>. The HTTP transaction will work whether the <iframe> is visible or not, so if you don't want your user to see the results you can just hide the <iframe> via CSS or whatever.