<html>
<head>
<meta http-equiv="Content-Type" c>
<title>判断iframe是否加载完毕的方法(兼容ie和Firefox)</title>
</head>
<body>
<div align="center" style="position: absolute; width: 100px; height: 100px; z-index: 1; left:158px; top:17px" id="load"><img src="http://sysimages.tq.cn/images/analysis_images/ajax-loader.gif" /> loading</div>
<iframe style="visibility:hidden" onreadystatechange=stateChangeIE(this) onload=stateChangeFirefox(this) name="callframe" id="callframe" width="420" height="100" frameborder="0" scrolling="no" marginheight="0"></iframe>
<script>
function stateChangeIE(_frame)
{
if (_frame.readyState=="interactive")//state: loading ,interactive, complete
{
var loader = document.getElementById("load");
loader.innerHTML = "";
loader.style.display = "none";
_frame.style.visibility = "visible";
}
}
function stateChangeFirefox(_frame)
{
var loader = document.getElementById("load");
loader.innerHTML = "";
loader.style.display = "none";
_frame.style.visibility = "visible";
}
callframe.location.href="http://www.hao123.com";
</script>
</body>
</html>
原文:http://m.cnblogs.com/43824/1368013.html
分享到:
相关推荐
对于非IE浏览器,如Firefox、Opera、Chrome等,它们支持`iframe`的`onload`事件。当`iframe`内容加载完毕时,`onload`事件会被触发。下面是如何使用`addEventListener`来监听`onload`事件: ```javascript var ...
当`readyState`属性的值变为"loaded"或"complete"时,表明`iframe`已经加载完毕。以下是一个示例代码: ```html var isIE = /msie/i.test(navigator.userAgent) && !window.opera; var iframe = document....
在 HTML 中使用这个函数时,我们可以给 Iframe 标签添加 `onload` 事件处理器,确保在页面加载完毕后执行高度调整: ```html <iframe width="100%" id="iframeid" onload="Javascript:SetCwinHeight()" height="1" ...
// 对于Firefox、Chrome、Safari等非IE浏览器 iframe.load(function() { // 在这里放置你需要在iframe加载完成后执行的代码 }); // 对于Internet Explorer if (iframe[0].attachEvent) { iframe[0].attachEvent(...
总结来说,jQuery操作iframe的方法主要依赖于其强大的选择器和方法集合,能够让我们在不同浏览器中轻松地进行DOM操作和内容交互。通过本文的介绍,开发者可以更加熟练地运用jQuery进行iframe相关开发工作。
本文将详细介绍两种在IE6、IE7及Firefox下实现`<iframe>`自适应高度的方法。 ### 方法一:JavaScript 调整高度 此方法主要通过JavaScript来动态获取`<iframe>`中内容的实际高度,并设置`<iframe>`的高度以实现...
3. **document.onreadystatechange事件**:这是一个IE浏览器提供的事件,通过检查document.readyState属性,当页面状态变为'complete'时,表示DOM树已经完全加载完毕,可以在此事件触发时执行相关操作。Safari浏览器...
然而,由于浏览器之间的兼容性差异(例如 IE 和 Firefox),实现这一目标并不简单。 #### 二、基本原理 本文档主要介绍了如何使用 JavaScript 来动态调整`<iframe>`的高度,使其能够根据内部内容的高度变化而自动...
1. **浏览器版本判断**:通过分析`navigator.userAgent`字符串来判断当前使用的是否为Firefox浏览器,并获取其版本号。这是为了处理Firefox在不同版本中存在的差异。 2. **函数定义**: - `dyniframesize`函数接收`...
支持的浏览器: IE 7.0+, Firefox 3.0+, Chrome 2.0+, Opera 9.5+, Safari 3.0+ 注:ExtAspNet基于一些开源的程序ExtJS, HtmlAgilityPack, Nii.JSON, YUICompressor。 示例: http://extasp.net/ 开源: ...
支持的浏览器: IE 7.0+, Firefox 3.0+, Chrome 2.0+, Opera 9.5+, Safari 3.0+ 注:ExtAspNet基于一些开源的程序ExtJS, HtmlAgilityPack, Nii.JSON, YUICompressor。 示例: http://extasp.net/ 开源: ...
`iframe`内的页面加载完毕后通过某种方式通知父页面。 3. 父页面根据收到的通知更新自身的内容。 #### 五、XMLHttpRequest对象 - **定义**:`XMLHttpRequest`是AJAX技术的核心,用于发送异步HTTP请求到服务器,并...
- Opera原内核Presto更新为Blink,IE浏览器内核为Trident,Mozilla Firefox的内核为Gecko,而Google Chrome的内核为Blink,Blink是WebKit的分支。 5. HTML5新特性及兼容性处理: - HTML5引入了新的元素和API,...
对于Firefox,直接监听"DOMContentLoaded"事件。而对于IE,Prototype使用`document.write`创建一个延迟加载的`<script>`标签,并设置`defer`属性,当这个脚本加载完成后触发DOMContentLoaded。 Prototype这种方法...
不过需要注意的是`defer`只在IE浏览器中有效,后来的Firefox 3.1、Safari 4、Chrome 2等浏览器也开始支持。 6. 使用document.write 方法:虽然这种做法被普遍认为是不推荐的,但在某些旧版的IE浏览器中,可以通过...
2. 常用浏览器包括Chrome、Firefox、Safari、IE/Edge等,它们的内核分别是Blink、Gecko、WebKit、Blink/EdgeHTML。 3. 浏览器内核通常指渲染引擎,负责解析HTML和CSS,执行JavaScript脚本以及绘制网页。 4. 标准...
在许多在线示例中,模拟的`ready`方法通常会在`window.onload`事件触发后才执行,这实际上意味着它们要等到整个页面(包括图片、脚本等)都加载完毕才会运行。然而,jQuery能够更早地执行,它在DOM结构构建完成,但...
- **阻塞`onload`事件**:直到`iframe`加载完毕,主页面的`onload`事件才会触发。 - **加载时间**:即使内容为空,也需要加载时间。 - **缺乏语义**:不利于SEO和可访问性。 **1.4 `href` 与 `src` 的区别** - ...