判断 iframe 是否加载完毕

最新推荐文章于 2026-03-29 03:31:55 发布

转载最新推荐文章于 2026-03-29 03:31:55 发布 · 3.1k 阅读

标签

#判断iframe是否加载完成

收录于

前端专栏收录该内容

31 篇文章

订阅专栏

本文介绍了三种检测iframe加载完成的方法，包括使用jQuery的load()函数、onreadystatechange事件以及attachEvent方法。这些方法可以帮助开发者确保在iframe完全加载后执行特定操作。

我能想到的有以下几种方式：

方法一、jQuery load()

Js代码

var frm = document.getElementById('myiframe');
$(frm).load(function(){ // 等iframe加载完毕
dosomething();
});

方法二、onreadystatechange

Js代码

var iframe = document.createElement("myiframe");
iframe.src = "http://www.baidu.com";
if (!/*@cc_on!@*/0) { //如果不是IE，IE的条件注释
iframe.onload = function(){
alert("Local iframe is now loaded.");
};
} else {
iframe.onreadystatechange = function(){ // IE下的节点都有onreadystatechange这个事件
if (iframe.readyState == "complete"){
alert("Local iframe is now loaded.");
}
};
}
document.body.appendChild(iframe);

方法三、attachEvent

Js代码

var iframe = document.createElement("iframe");
iframe.src = "http://www.baidu.com";
if (iframe.attachEvent){
iframe.attachEvent("onload", function(){ // IE
alert("Local iframe is now loaded.");
});
} else {
iframe.onload = function(){ // 非IE
alert("Local iframe is now loaded.");
};
}
document.body.appendChild(iframe);

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

悠悠倾我心

关注关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

基于JS判断iframe是否加载成功的方法(多种浏览器）

10-22

主要介绍了基于JS判断iframe是否加载成功的方法【多种浏览器】的相关资料,需要的朋友可以参考下

参与评论您还未登录，请先登录后发表或查看评论

iframe的onreadystatechange事件在firefox下的使用

12-07

firefox不支持iframe的onreadystatechange事件，这个让我调试一下下午。。。直接贴代码我这里想做的效果是先生成一个iframe，当我想里面加载内容的时候触发这个事件，代码可以很清晰的看到用onload方法来进行替代了。

IFrame 加载网页完成事件

mobingdetong的专栏

01-28

1495

今天，需要用到IFrame, 且用法比较特别，两个IFrame在同一个网页上，且需要加载完成一个IFrame后，才开始加载令一个IFrame，所以用到了IFrame加载完成的方法。把网上的资料整理如下： > html> head> script type="text/javascript"> var iframe; functi

如何检测 iframe 是否加载完成的 JavaScript 方法

YabClass的博客

10-04

2679

在网页开发中，有时候我们需要在加载嵌入的 iframe 页面完成后执行一些操作。接下来，我们可以为 iframe 元素添加一个 “load” 事件监听器，该事件会在 iframe 加载完成后触发。我们可以通过监听这个事件来判断 iframe 是否已经加载完成。在上述示例中，我们通过获取 iframe 元素并添加 “load” 事件监听器来检测 iframe 加载完成的状态。在事件监听器中，可以添加一些判断逻辑来确定 iframe 是否已经加载完成。首先，我们需要获取到要检测加载完成的 iframe 元素。

保姆级教程：在Ubuntu 24.04上配置Ollama服务并开机自启（附systemctl管理命令）

最新发布

weixin_30872337的博客

03-29

680

本文提供在Ubuntu 24.04上配置Ollama服务的详细指南，涵盖从基础环境准备到生产级部署的全过程。内容包括安全基线配置、systemd服务集成、高级运维监控、模型版本控制及网络优化等关键步骤，帮助用户实现稳定可靠的本地LLM服务部署。特别介绍如何使用systemctl管理命令实现开机自启，确保服务持续运行。

iframe 是否加载完成的完美方法

忆水思寒的博客

09-18

1672

判断iframe是否加载完成的完美方法 IE 支持 iframe 的 onload 事件，不过是隐形的，需要通过 attachEvent 来注册。第二种方法比第一种方法更完美(采用readystatechange判断)，因为 readystatechange 事件相对于 load 事件有一些潜在的问题。这里感觉说的并不是完全准确，开始给我造成了很大的困扰。看其代码才明白，真正意义上来讲IE在创建一个新的iframe时的onload方法需要使用attachEvent来绑定，而原来就存在的iframe的o

判断iframe是否加载完成的完美方法

GTbond的博客

04-25

8779

判断iframe是否加载完成的完美方法需求：vue某个组件引入iframe，需要判断iframe是否加载完毕，不然用户进入是白屏加载中 created (){ 使用加载提示框 } mounted () { const iframe = document.querySelector('#iframe') // 处理兼容行问题 if (iframe.attachEvent) { iframe.attachEvent('onload', () => {

iframe使用的时候如何判断是否加载完毕

火麒马

06-21

2150

//添加一个加载事件 var iframe = document.getElementById("oneIframechart"); if (iframe.attachEvent) { iframe.attachEvent("onload", function () { document.getElemen...

js 判断iframe是否加载完毕

weixin_30950887的博客

09-13

455

js 判断iframe是否加载完毕 CreationTime--2018年9月13日15点30分 Author:Marydon 1.javascript实现 window.onload = function() { var iframe = document.getElementById("myframe") if (iframe.attachEvent) { ...

判断iframe标签是否加载完成，并做loading效果(记录)

热门推荐

weixin_61285710的博客

12-15

1万+

判断iframe标签是否加载完成，并做loading效果

判断iframe是否加载完成

nick_zhang的博客

11-29

2145

v-loading要加在iframe外面，通过onload事件判断iframe是否加载完成。

iframe判断加载是否完成添加loading或者取消loading效果

weixin_45776308的博客

01-08

2042

2.2 将src置空后会立马又调一次这个加载方法，但是此时iframe的内容为空白，所以判断src是否为空值再进行操作，比如我这个里面是加载完成后将loading效果去除。2.1在来回切换iframe得src时，有的iframe已经加载完成却没进入到加载完成得方法中，解决方法：把src置空后调用此方法，然后把src的赋值写在方法的最后面。1.判断iframe是否加载完成的方法。

iframe在开发过程中的使用

王小义笔记

11-17

251

在网页开发的过程中，难免会有使用iframe的情景，页面嵌入iframe之后，会涉及到父页面取值，自然也有需要取父页面的值。父页面取iframe值，通过测试发现，在ready函数中，获取不到iframe的内容，所以在 <iframe src='XXX.action' ></iframe> window.onload=function(){ var uuid=document.getElementById('iframe').contentWindow.docum

Iframe使用小结

wangcaiwq的专栏

05-24

181

1. Iframe里的页面的$(document).ready()未执行。解释如下： IE只有在页面不是嵌入frame中的情况下才和Firefox等一样，先执行$(document).ready()的内容，再执行原来的onload方法。对于嵌入frame中的页面，也只是绑定在load事件上执行，所以自然是在原来的onload绑定的方法执行之后才轮到。只好用onload了。参考文章：http:...

JS判断页面所有Iframe是否全部请求完成加载完成

ShuLiu's Log Book

06-29

8722

JS判断页面所有Iframe是否全部请求完成，加载完成。

html 页面onready,HTML readyState 属性 iframe onreadystatechange事件

weixin_34981046的博客

06-09

959

首先：iframe onreadystatechange的事件只用于ie5.5以上版本frame不支持onreadystatechange的事件对于iframe或者在js里面写：function loadFile(){document.frames("ifm_Test").location.href="http://www.google.cn";document.frames("ifm_T...