Execute jQuery once document is ready AND iframe content is loaded

问题

As you can see on this page http://musicglaze.com/chase-status-let-you-go-feat-mali-feed-me-remix/#comments
comment section is way out of place, After research I understood that it is caused because plugin responsible for styling (http://masonry.desandro.com/) is called within

$(document).ready(function(){

});

function. however, content is loaded into iframe after that, therefore changing its height, but as plugin takes into account its original height without content everything gets messed up. Is there something I can use which would behave similar to this pseudocode?

Document ready AND iframe content loaded {

//My jQuery code

}

回答1:

same ready() function

$(document).ready(function() {
    $('#frameId').ready(function() {
    ...
    });
})

回答2:

Use $('#iframeId').load(function() { ... }); instead of onReady. The underlying issue is that there are cross-domain security risks to allowing the parent frame access to an iframe's content, so onReady is not available, but onLoad is still accessible. For more details, see: http://www.nczonline.net/blog/2009/09/15/iframes-onload-and-documentdomain/

来源：https://stackoverflow.com/questions/16253714/execute-jquery-once-document-is-ready-and-iframe-content-is-loaded