Как мне вызвать событие, когда HTML-страница становится длиннее? - PullRequest
3 голосов
/ 08 декабря 2011

У меня есть страница с iframe.Содержимое iframe иногда выполняет динамические вещи JS, которые вызывают их рост.Когда это происходит, мне нужно изменить размер iframe, чтобы убедиться, что он достаточно длинный, что я и делаю с этим, внутри iframe:

// I saved you the boredom of all the try{}s and != nulls, this is just the meat.
document.parentWindow.parent.reSize();

И это, которое находится в родительском html:

function reSize()
{
    try
    {
        var oBody   =   ifrm.document.body;
        var oFrame  =   document.all('ifrm');

        oFrame.style.height = oBody.scrollHeight + (oBody.offsetHeight - oBody.clientHeight) + 100;
    }
    //An error is raised if the IFrame domain != its container's domain
    catch(e) { }
}

Тем не менее, призывы к этому повторяются повсюду, в любом месте, где могло произойти изменение размера.Можно ли где-нибудь поставить это так, чтобы оно было "автоматическим"?Некоторое событие, которое я могу вызвать или что-то в этом роде?

Соответствующие ссылки:

Ответы [ 4 ]

1 голос
/ 08 декабря 2011

Поместите этот код прямо над закрывающим тегом родительского окна. поместите ваш код изменения размера iframe туда, где он закомментирован.

СТАРЫЙ КОД:

<script>
    var intWinHeight = (typeof window.innerHeight != 'undefined' ? window.innerHeight : document.body.offsetHeight);

    var resizeIframe = function() {
        var newWinHeight = (typeof window.innerHeight != 'undefined' ? window.innerHeight : document.body.offsetHeight);
        if(newWinHeight != intWinHeight) {
            intWinHeight = newWinHeight;
            // execute your Iframe resizing code here

        }
    }
    setInterval(resizeIframe, 100);
</script>

НОВЫЙ КОД:

<script type="text/javascript">

    var iFrameId = document.getElementById('myIframe');
    var intWinHeight = (typeof window.innerHeight != 'undefined' ? window.innerHeight : document.body.offsetHeight);
    var intIframHeight = (typeof iFrameId.contentWindow.window.innerHeight != 'undefined' ? iFrameId.contentWindow.window.innerHeight : iFrameId.contentWindow.document.body.offsetHeight);
    function exeResizeIframe() {
        var newWinHeight = (typeof window.innerHeight != 'undefined' ? window.innerHeight : document.body.offsetHeight);
        var newIframHeight = (typeof iFrameId.contentWindow.window.innerHeight != 'undefined' ? iFrameId.contentWindow.window.innerHeight : iFrameId.contentWindow.document.body.offsetHeight);
        if((newWinHeight != intWinHeight) || intIframHeight != newIframHeight) {
            intWinHeight = newWinHeight;
            intIframHeight = newIframHeight;
            // execute your Iframe resizing code here

        }
    }
    setInterval("exeResizeIframe()", 100);
</script>

Обратите внимание, измените идентификатор iframe из-за ограничений безопасности в IE <9 в ifram src </p> будут работать только локальные пути

0 голосов
/ 08 декабря 2011

Этот код работает, по крайней мере, в Firefox, Chrome 16 и IE 8.Он получен из ответа @ TimWickstrom.com, но с удаленным материалом внешней рамки и некоторыми изменениями в вычислениях высоты:

<iframe id='ifrm' width='100%' scrolling='no' ...>

var iFrame = document.getElementById('ifrm'); 
function stateChange(){ if (obj.readyState=='loading') { scroll(0,0); } }
iFrame.onreadystatechange='stateChange()';
var iFrameHeight = -1;
function resizeIframe() {
    var iFrameBody = typeof iFrame.contentDocument != 'undefined' ? iFrame.contentDocument.body : iFrame.contentWindow.document.body;
    if (iFrameBody == null) return;
    var newiFrameHeight = typeof window.innerHeight != 'undefined' ? iFrameBody.scrollHeight : (iFrameBody.scrollHeight + iFrameBody.offsetHeight - iFrameBody.clientHeight);
    if(iFrameHeight != newiFrameHeight) {
        iFrameHeight = newiFrameHeight;
        iFrame.style.height = newiFrameHeight;
    }
}
iFrame.onload = function() { setInterval('resizeIframe()', 100); }
0 голосов
/ 08 декабря 2011

Может быть, связать событие в родительском окне, которое изменяет размер iframe и запускать его всякий раз, когда динамический js вызывает его рост (запускать его из содержимого iframe. Посмотрите на этот пост: http://forum.jquery.com/topic/trigger-from-iframe-to-parent-window

0 голосов
/ 08 декабря 2011

Вы можете инициировать пользовательское событие после выполнения «динамических вещей JS».В другом месте присоедините только одного слушателя, чей обратный вызов выполняет document.parentWindow.parent.reSize();.

. Дополнительная информация:

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...