Сделать document.ready с учетом элементов из внешнего iframe

Question

Положение, в котором я нахожусь, заключается в следующем. У меня есть плагин JQuery, который должен быть вложен в document.ready функция. Этот плагин применяет некоторые стили к элементам страницы. Один из элементов этого плагина содержит iframe. Этот iframe не с моего сайта. Проблема в том, что document.ready не принимает во внимание содержимое iframe, а когда он загружается, его высота меняется, но плагин jQuery уже применялся до этого, поэтому макет страницы облажался.

Я попробовал следующее, чтобы плагин get вызывался, только если документ готов, а iframe также готов:

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

Но это не работает, и я ищу другое решение.

Answer 1

Только документ имеет ready() событие, для iFrame это будет onload:

$(document).ready(function() {
    $('#frameId').on('load', function() {
    //plugin code
    });
});

Но почему вашему плагину требуется доступ к iFrame?

Answer 2

Решение $.holdReady();

$.holdReady(true);
$(document).ready(function() {
    //plugin code
});

$('#frameId').on('load', function() {
   $.holdReady(false);
});

Для доступа к высоте междоменного содержимого iFrame вам понадобится postMessage. Проверьте этот пост