HTML页面局部刷新时根据数据动态改变<iframe>标签的高度

1.在<iframe>的具体页面(就是子页面),添加javascript
<javascript>
    function IframeResize(){
     //alert(this.document.body.scrollHeight); //弹出当前页面的高度
     var obj = parent.document.getElementById("childFrame"); //取得父页面IFrame对  象
    //alert(obj.height); //弹出父页面中IFrame中设置的高度
       obj.height = this.document.body.scrollHeight; //调整父页面中IFrame的高度为此页面的高度
    }
</javascript>
2.在<iframe>的具体页面(就是子页面)的body中添加onload事件:    
    <body onload="IframeResize()">
3.再父页面的<iframe>标签添加ID,即上面第一步,方法体中第2步所写到的childFrame
<iframe id="childFrame"></iframe >

        

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 自适应高度,其实就是设置iframe的高度,使其等于内嵌网页的高度,从而看不出来滚动条和嵌套痕迹。对于用户体验和网...
    布拉德皮蛋_qzy阅读 3,389评论 0 3
  • 事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放...
    孤魂草阅读 915评论 0 0
  • 一、JS前言 (1)认识JS 也许你已经了解HTML标记(也称为结构),知道了CSS样式(也称为表示),会使用HT...
    凛0_0阅读 2,807评论 0 8
  • 一个人上班,一个人旅行,一个人生活,一个人吃饭,一个人看电影到深夜,一个人喝酒,一个人散步,一个人吹着风,房间布...
    momo袅袅阅读 207评论 0 0
  • 材料 : 桃 2 个 水果刀 1 把 模具 1 个 莲 花 桃 桃洗净,用小刀...
    秭归橙子和水果阅读 356评论 0 0