经过3天的研究和反复试验,我无法获取iframe或其内容来触发调整大小事件,因此无法调用调整大小函数。如果我使用... trigger(“ resize”); 要手动触发调整大小事件,我的调整大小函数将被调用并起作用。iframe中加载http://localhost:81/curlExample/
的页面与包含iframe的页面位于同一个域()中。最终,iframe中的页面将由php curl方法提供,但是我想使其首先工作。
*******更新********当我调整浏览器窗口的大小并导致iframe调整其大小时,如何触发调整大小事件?
谢谢您的帮助!
iframe页面
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
function setResize()
{
window.alert("Hello");
var iframeRef = document.getElementById('displayframe');
$(iframeRef).on("resize", function(){
var xExp = 0;
window.alert("Resize event fired.");
});
}
$('#displayframe').load(function()
{
alert("Hello from iFrame. Load event fired.");
var myStallTime = setTimeout(setResize, 3000);
});
});
</script>
</head>
<body>
<p id="myP">Hello</p>
<iframe id="displayframe" src="http://localhost:81/curlExample/HelloIframe.xhtml" style="height:250px; width:100%;">
<p>Your browser does not support iframes.</p>
</iframe>
</body>
</html>
iframe中的页面(HelloIframe.xhtml)
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>TODO supply a title</title>
</head>
<body>
<div id="myContent" style="width:100%; height:200px;">
<h1>TODO write content</h1>
<h2>Extremity sweetness difficult behaviour he of</h2>
<p>Agreed joy vanity regret met may ladies oppose who. Mile fail as left as hard eyes. Meet made call in mean four year it to. Prospect so branched wondered sensible of up. For gay consisted resolving pronounce sportsman saw discovery not. Northward or household as conveying we earnestly believing. No in up contrasted discretion inhabiting excellence. Entreaties we collecting unpleasant at everything conviction.</p>
<p>Yet remarkably appearance get him his projection. Diverted endeavor bed peculiar men the not desirous. Acuteness abilities ask can offending furnished fulfilled sex. Warrant fifteen exposed ye at mistake. Blush since so in noisy still built up an again. As young ye hopes no he place means. Partiality diminution gay yet entreaties admiration. In mr it he mention perhaps attempt pointed suppose. Unknown ye chamber of warrant of norland arrived.</p>
</div>
</body>
</html>
该<iframe>
元素将永远不会触发resize事件,像一个<img>
或一个<div>
。您必须从获得此事件window
。由于iframe文档与父文档来自同一来源,因此您可以访问其iframe文档contentWindow
和其他任何属性。
因此,请尝试以下操作:
var iframeWin = document.getElementById('displayframe').contentWindow;
$(iframeWin).on('resize', function(){ ... });
我只使用DOM的addEventListener
。
var iframeWin = document.getElementById('displayframe').contentWindow;
iframeWin.addEventListener('resize', function(){ ... });
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句