基于jquery的兼容各种浏览器的iframe自适应高度的脚本_jquery

jquery很强大,代码很简单:

复制代码 代码如下:

$("#iPersonalInfo").load(function() {
$(this).height($(this).contents().height());
})

有一点需要注意的,我也在调试的时候才发现的,耽误了不少时间。就是绑定事件必须在iframe加载完毕之前绑定,否则不会执行。

以下是jQuery,load事件的概述

在每一个匹配元素的load事件中绑定一个处理函数。

如果绑定给window对象,则会在所有内容加载后触发,包括窗口,框架,对象和图像。如果绑定在元素上,则当元素的内容加载完毕后触发。

注意:只有当在这个元素完全加载完之前绑定load的处理函数,才会在他加载完后触发。如果之后再绑定就永远不会触发了。所以不要在$(document).ready()里绑定load事件,因为jQuery会在所有DOM加载完成后再绑定load事件。

时间: 2024-11-15 21:29:14

基于jquery的兼容各种浏览器的iframe自适应高度的脚本_jquery的相关文章

兼容主流浏览器的iframe自适应高度js脚本

 兼容主流浏览器的 iframe 自适应高度,很实用的,具体的js脚本如下,感兴趣的朋友可不要错过  兼容主流浏览器的 Iframe 自适应高度,js脚本如下:   代码如下: //iframe 高度自适应  function iframeAutoFit(iframeObj) {  setTimeout(function () {  if (!iframeObj) return;  iframeObj.height = (iframeObj.Document ? iframeObj.Docume

兼容主流浏览器的iframe自适应高度js脚本_javascript技巧

兼容主流浏览器的 Iframe 自适应高度,js脚本如下: 复制代码 代码如下: //iframe 高度自适应 function iframeAutoFit(iframeObj) { setTimeout(function () { if (!iframeObj) return; iframeObj.height = (iframeObj.Document ? iframeObj.Document.body.scrollHeight : iframeObj.contentDocument.bod

兼容多浏览器的iframe自适应高度(ie8 、谷歌浏览器4.0和 firefox3.5.3)_javascript技巧

小项目龙里中学多媒体教室管理系统中后台管理用到了iframe.由于要动态载入内容,所以需要iframe自适应内容页的高度.用谷歌搜索到很多答案,其中成功的是这段代码 复制代码 代码如下: <script type="text/javascript"> function SetCwinHeight() { var iframeid = document.getElementById("maincontent1"); //iframe id if (docu

javascript原生和jquery库实现iframe自适应高度和宽度_jquery

javascript原生和jquery库实现iframe自适应内容高度和宽度---推荐使用jQuery的代码! ‍<iframe src="index.php" id="mainiframe" name="mainiframe" width="100%" frameborder="0" scrolling="no" marginwidth="0" marginh

jquery iframe自适应高度代码(浏览器兼容)

jquery 代码一 $("#ipersonalinfo").load(function() { $(this).height($(this).contents().height()); })   代码 二 <script type="text/网页特效"> //iframe 自适应高度 function setcwinheight(){ var bobo=document.getelementbyid("main"); //ifra

使用jQuery不判断浏览器高度解决iframe自适应高度问题_jquery

这里介绍两个超级简单的方法,不用写什么判断浏览器高度.宽度啥的. 下面的两种方法自选其一就行了.一个是放在和iframe同页面的,一个是放在test.html页面的. 注意别放错了地方. iframe的代码中,注意要写ID,没有ID查找不到 复制代码 代码如下: <iframe src="test.html" id="main" width="700" height="300" frameborder="0&q

Iframe实现跨浏览器自适应高度解决方法_jquery

本文以实例形式讲述了Iframe实现跨浏览器自适应高度解决方法,非常具有实用价值.分享给大家供大家参考之用.具体方法如下: 该方法使用了jQuery,因此需要在iframe的src页面里面引入jQuery. 父页面里面相对简单一点,主要包含以下代码: <iframe id="if1" scrolling="no" src="2.html"></iframe> 在iframe的src页面里面代码如下: <script

JS实现iframe自适应高度的方法(兼容IE与FireFox)_javascript技巧

本文实例讲述了JS实现iframe自适应高度的方法.分享给大家供大家参考,具体如下: 之前一直被iframe自适应高度的问题困扰,很多JS代码在FF里面似乎就变成哑巴了.后来下面这段代码终于被我从万千号称兼容FF的代码堆中翻了出来.我已经用过了,真的好用.尤其是对于我这样的JS水平较低(真不好意思)的人来说,这段代码简单易懂,方便修改,只要把下面的代码复制粘贴到iframe所在页面的<body>标签里面,并且修改一下ID名就行了(注意,要修改的地方有两个,位置在代码中有说明). 向原创这段代码

jquery ajax应用中iframe自适应高度问题解决方法_javascript技巧

iframe自适应高度本身是很简单的方法,就是在页面加载完成后,重新计算一下高度即可. 代码如下: 复制代码 代码如下: //公共方法:设置iframe的高度以保证全部显示数据//function SetPageHeight() {//    var iframe = getUrlParam('ifname');//    var myiframe = window.parent.document.getElementById(iframe);//     iframeLoaded(myifra