动态调整使用AJAX的iframe的大小

时间:2013-11-07 15:14:21

标签: javascript jquery html ajax iframe

我正在尝试动态调整iframe 的大小。这并不难,直到我将iframe页面更改为使用 AJAX和jQuery 。我将一个函数附加到iframe body的resize事件,该事件也应该调整iframe的大小。似乎在它开始使用AJAX之后它将不再触发resize事件。

以下是我在父网站中的代码:

$(function(){
    var iframe = $('#myiframe');

    iframe.load( function() {
        var iframe_content = iframe.contents().find('#content');

        iframe_content.resize( function() {
            var elem = $(this);
            var newHeight = elem.height();

          // Resize the iframe.
          iframe.css({ height: newHeight });
      });

        // Resize the iframe immediately
        iframe_content.resize();
    });
});

以下是 iframe网站中的AJAX表单:

<form onsubmit="jQuery.ajax({type: 'GET',
                             data: $(this).serialize(), 
                             url:  '/employeedirectory/employee/ajaxUpdate',
                             success:function( data, textStatus ) {
                                    $('#results').html(data);

                                    // Go to the parent document, find the content div, and call its resize event
                                    $(document, parent.window.document).contents().find('#myiframe').contents().find('#content').resize();
                                },
                            error: function( XMLHttpRequest, textStatus, errorThrown ) {} }); 
                return false;"
        id="searchForm">
</form>

如果我在父网站上运行$('#myiframe').contents().find('#content').resize()来强制调整大小事件,那么它的工作正常。但它似乎并没有像我想要的那样调用onsuccess。有没有人有任何想法?

0 个答案:

没有答案