Question

我有以下代码，根据IFrame内容的大小调整IFrame的大小：

     <html>
   <head>
   <title></title>
   </head>
   <body>
   <iframe src="http://page.html"
   id="iframeid" width="600" height="700" scrolling="no" onload="setIframeHeight(this.id)"></iframe> 
  <script>
 function setIframeHeight(id) {
 var ifrm = document.getElementById(id); 
 var doc = ifrm.contentDocument? ifrm.contentDocument:ifrm.contentWindow.document; 
 ifrm.style.height = "10px";
 ifrm.style.height = getDocHeight(doc) + 4 +"px";
 }

 function getDocHeight(doc){
 doc = doc || document; 
 var body = doc.body; html = doc.documentElement; 
 var height =Math.max(body.scrollHeight, body.offsetHeight, html.clientHeight,    html.scrollHeight, html.offsetHeight); 
 return height;
 }
  $('iframe').css('height', $('iframe body').height() + 'px');
   </script> </body> </html>

这很好用。 IFrame大小根据导入站点的大小设置

的http //：page.html中

问题是当http //：page.html包含链接时。单击此链接时，iframe大小不会更新。

问题是：如何在点击链接时更新iframesize？

Answer 1

为iframe中的加载添加事件侦听器以触发您的函数：

$("iframe").on("load", function() {

    setIframeHeight(id);

    });

只要iframe URL与父文档属于同一个域，这就应该有效。如果不是，您可能会遇到浏览器安全限制，这会导致此操作失败。

如果点击iframe中的某个链接，如何更新iframe端？

1 个答案: