当前位置：首页 → 问答吧 → jquery iframe跨域自适应高度。子页面分页，刷新父页面。

jquery iframe跨域自适应高度。子页面分页，刷新父页面。

时间：2010-06-05

来源：互联网

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>跨域IFrame自动高度</title> <script language="javascript" src="jquery.js" type="text/javascript"></script> <script type="text/javascript"> function autoHeightIFrameNavigate(iframeId,url) { var iframe = $('#' + iframeId); iframe.attr('_name_',iframe.attr('name')) //备份原来的 name .attr('src',url) //设置URL .one('load',function () { this.contentWindow.location = "about:blank"; //导向代理页面，我直接使用了这个 $(this).one('load',function () { var msg = this.contentWindow.name; //得到值这个值就是高度了 this.contentWindow.name = $(this).attr('_name_'); //恢复原来的 Name this.contentWindow.location = url; //再次导向目标页面 try { var height = eval(msg); //得到并设置高度 // alert(height); iframe.css('height', height + 'px'); } catch(e) { alert('目标页面没有设置高度到 window.name') } }) }) } $(document).ready(function(){autoHeightIFrameNavigate('iframePreview','http://58.30.227.36:802/a2.html');},100); </script> </head> <body> <div> <iframe id="iframePreview" style="width: 100%;height:800px;" scrolling="no" frameborder="no"></iframe> </div> </body> </html>
提示：您可以先修改部分代码再运行

父页面

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>Untitled</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(function(){ window.name = document.body.scrollHeight; }); </script> </head> <body> <a href="a3.html"> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/>测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> 测试测试测试！<br/> </a> </body> </html>
提示：您可以先修改部分代码再运行

子页面，。

如果子页面有分页。
子页面的下一页如何实现，刷新父页面自适应高度的函数？

作者: xuejs 发布时间: 2010-06-05

子页面把高度数据用锚点参数的形式添加到父页面

作者: tangbin1987 发布时间: 2010-06-05

能举个例子不？

作者: xuejs 发布时间: 2010-06-05