Detecting DOM Ready State Within an iFrame (jQuery)

问题

I have a script being run in a document that may or may not be nested in an iframe. I have sorted out the issue of detecting the nested, but I can't figure out how to detect the ready state of the DOM when it is an iframe.

Here is what I have already:

if (window.self !== window.top) {
    // is nested
    // DOM ready test here
        // execute code here
} else {
    // is not nested
    $(document).ready(function() {
        // execute code here
    });
}

I have already read this post, but I don't see the answer to my specific question. I may be misunderstanding the solutions there, so feel free to correct me.

EDIT: This seems to be a Fancybox issue. This code:

alert(document.getElementById('username').className);
document.getElementById('username').focus();

I see an alert with the correct value, but the form element does not receive the focus. This tells me that it's not an issue with detecting the DOM's ready state. The original script I was trying to use was this:

$(document).ready(function() {
    $('input.focus:last').focus();
});

EDIT 2/SOLUTION: I had to resort to a Fancybox specific solution because it appears to be a Fancybox specific issue. I added this line to the configuration for these Fancybox iframed forms:

'onComplete':function(){$('input.focus:last').focus();}

回答1:

You can place a SCRIPT tag at the end of the iframe BODY tag.
Then add your code there, it will be executed when the iframe body is loaded.

You can either run a local JS code of the iframe, or call an object in the parent like:

<body>
  ...
  <script>
    parent.myObj.iframeLoaded(document.body);
  </script>
</body>

To my experience, the onload event in IE is not reliable.
i.e: it won't wait to the JS inside the iframe to be loaded before firing.

来源：https://stackoverflow.com/questions/2178628/detecting-dom-ready-state-within-an-iframe-jquery

标签

javascript

jquery

dom

iframe

fancybox