Как я могу получить iframe для автоматического изменения размера при изменении его "src"? (используя jQuery)

Question

Я написал этот код:

$('#main-content > iframe').load(function(){
    var $document = $(this.contentWindow.document);
    alert($document.height());
    $(this).height($document.height());
});

Это работает при первой загрузке страницы, но когда пользователь изменяет src iframe во время использования страницы, он не изменяет размер.

Я меняю src следующим образом:

$('#main-content > iframe').attr("src",href);

Не нужно беспокоиться о XSS - все локально.

Есть предложения?

Answer 1

<script type="text/javascript">
$(document).ready(function(){
    $('#main-content > iframe').attr('src','onmouseclick.html');
    set();
});
function set() {
    $('#main-content > iframe').load(function(){
        var $document = $(this.contentWindow.document);
        //alert($document.height());
        $(this).height($document.height());
    });
}
</script>

<div id="main-content">
 <iframe id="main-contentiframe"></iframe>
 <a href="onmouseclick.html" onmouseover="$('#main-content > iframe').attr('src',this.href);set();return false;">Link</a>
 <a href="testscript.html" onmouseover="$('#main-content > iframe').attr('src',this.href);set();return false;">Link</a>
</div>

Answer 2

В Internet Explorer вы можете добавить EventListener к onreadystatechange iframes, по моему опыту, он работает более надежно, чем load

Более подробную информацию можно найти на MSDN

Пример:

$('#main-content > iframe')[0].onreadystatechange = function(evt)
{
    if(window.event)
        evt = window.event;
    var $document = $(evt.srcElement);
    alert($document.height());
    $(this).height($document.height());
}

Осторожно, я не проверял код