我正在尝试动态调整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
。有没有人有任何想法?