

Then, in the parent window you attach a handler to react to that event. Please note, that we're leveraging the DOM ready event to fire the event - which should be suitable for most use cases. The iframe fires an event on the (potentially existing) parent window's document - please beware that the parent document needs a jQuery instance of itself for this to work. More generally speaking, it shouldn't be the concern of the iframe to know its surrounding environment. This solution has the advantage of not breaking when the containing page does not contain the expected load handler. The iframe fires an event on the (potentially existing) parent window's document - please beware that the parent document needs a jQuery instance of itself for this to work. $(document).on('iframeready', myHandler) W.parent.jQuery(w.parent.document).trigger('iframeready') This function will also work in that scenario.Along the lines of Tim Down's answer but leveraging jQuery (mentioned by the OP) and loosely coupling the containing page and the iframe, you could do the following: IFrame src can have redirects and therefore load a page different from the original src url. So, in any scenario, the callback function will run after iFrame is fully loaded. The load event is equivalent to readyState = "complete" which has been used to check whether iFrame is already loaded. So it uses the load event for running the callback function if iFrame isn't already loaded. Therefore, besides checking for readyState value, this function also addresses the about:blank issue.ĭOMContentLoaded event doesn't work with iFrame. So, the initial value of readyState will not represent the readyState of your actual iFrame. Later, it will replace `about:blank with the actual iframe src value. This attribute also accepts the values self and src which represent the origin in the iframe's src attribute.

A list of origins the frame is allowed to display content from. This also addresses the following issues:Ĭhrome initializes every iFrame with an about:blank page which will have readyState = "complete". A string that specifies the alignment of the frame with respect to the surrounding context. This function will run your callback function immediately if the iFrame is already loaded or wait until the iFrame is completely loaded. To see what happens when the src domain is different from Use the preceeding link to change the src of the iframe To further the example, try using this as the content of the iframe: Child This can happen if the src of the iframe is Var doc = ntentDocument || Īlert((0, 50)) EDIT : for wider support, fallback to contentWindow.document body of the page that the iframe is showing.

Displays the first 50 chars in the innerHTML of the
#Iframe onload code
Here is some example code the illustrates what I'm talking about: This is a security feature that prevents you from executing arbitrary JavaScript on someone else's page, which would create a cross-site scripting vulnerability. An exception will be thrown if the src is from a different domain though. In order to get the content from the page referred to by the iframe's src attribute, you need to access the iframe's contentDocument property. The innerHTML of your iframe is blank because your iframe tag doesn't surround any content in the parent document.
