jQuery .ready in a dynamically inserted iframe
I answered a similar question (see Javascript callback when IFRAME is finished loading?).You can obtain control over the iframe load event with the following code:
function callIframe(url, callback) { $(document.body).append('<IFRAME id="myId" ...>'); $('iframe#myId').attr('src', url); $('iframe#myId').load(function() { callback(this); });}In dealing with iframes I found good enough to use load event instead of document ready event.
Using jQuery 1.3.2 the following worked for me:
$('iframe').ready(function() { $('body', $('iframe').contents()).html('Hello World!');});REVISION:!Actually the above code sometimes looks like it works in Firefox, never looks like it works in Opera.
Instead I implemented a polling solution for my purposes. Simplified down it looks like this:
$(function() { function manipIframe() { el = $('body', $('iframe').contents()); if (el.length != 1) { setTimeout(manipIframe, 100); return; } el.html('Hello World!'); } manipIframe();});This doesn't require code in the called iframe pages. All code resides and executes from the parent frame/window.
In IFrames I usually solve this problem by putting a small script to the very end of the block:
<body>The content of your IFrame<script type="text/javascript">//<![CDATA[ fireOnReadyEvent(); parent.IFrameLoaded();//]]></script></body>This work most of the time for me. Sometimes the simplest and most naive solution is the most appropriate.