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


Posted in Javascript onAugust 03, 2016

本文实例讲述了JS判断iframe是否加载完成的方法。分享给大家供大家参考,具体如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
</head>
<body>
<script type="text/javascript">
var isIE = /msie/i.test(navigator.userAgent) && !window.opera;
var iframe = document.createElement("iframe");
iframe.src = "https://3water.com/";
if (isIE) {
  iframe.onreadystatechange = function(){
    if(iframe.readyState == "loaded" || iframe.readyState == "complete"){
      alert("loaded");
    }
  };
} else {
  iframe.onload = function(){
    alert("loaded");
  };
}
document.body.appendChild(iframe);
</script>
</body>
</html>

或者:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
</head>
<body>
<script type="text/javascript">
var iframe = document.createElement("iframe");
iframe.src = "https://3water.com/";
if (iframe.attachEvent){
  iframe.attachEvent("onload", function(){
    alert("loaded");
  });
} else {
  iframe.onload = function(){
    alert("loaded");
  };
}
document.body.appendChild(iframe);
</script>
</body>
</html>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
jquery validate 自定义验证方法介绍 日期验证
Feb 27 Javascript
javascript实现鼠标移到Image上方时显示文字效果的方法
Aug 07 Javascript
基于javascript实现图片左右切换效果
Jan 25 Javascript
sencha ext js 6 快速入门(必看)
Jun 01 Javascript
jQuery插件FusionCharts绘制的2D帕累托图效果示例【附demo源码】
Mar 28 jQuery
深入理解ES6学习笔记之块级作用域绑定
Aug 19 Javascript
Angular 5.0 来了! 有这些大变化
Nov 15 Javascript
ES6学习笔记之map、set与数组、对象的对比
Mar 01 Javascript
node.js到底要不要加分号浅析
Jul 11 Javascript
微信小程序视图控件与bindtap之间的问题的解决
Apr 08 Javascript
vue element-ui table组件动态生成表头和数据并修改单元格格式 父子组件通信
Aug 15 Javascript
VUE的history模式下除了index外其他路由404报错解决办法
Aug 21 Javascript
两行代码轻松搞定JavaScript日期验证
Aug 03 #Javascript
Highcharts学习之数据列
Aug 03 #Javascript
JavaScript中日期函数的相关操作知识
Aug 03 #Javascript
JS实现的表格行上下移动操作示例
Aug 03 #Javascript
基于jQuery实现淡入淡出效果轮播图
Jul 31 #Javascript
JS使用正则表达式实现关键字替换加粗功能示例
Aug 03 #Javascript
Angular2内置指令NgFor和NgIf详解
Aug 03 #Javascript
You might like
PHP 数组入门教程小结
2009/05/20 PHP
Joomla数据库操作之JFactory::getDBO用法
2016/05/05 PHP
php文件系统处理方法小结
2016/05/23 PHP
PHP使用PDO调用mssql存储过程的方法示例
2017/10/07 PHP
浅谈laravel 5.6 安装 windows上使用composer的安装过程
2019/10/18 PHP
laravel Task Scheduling(任务调度)在windows下的使用详解
2019/10/22 PHP
jQuery源码分析-02正则表达式 RegExp 常用正则表达式
2011/11/14 Javascript
javascript继承之为什么要继承
2012/11/10 Javascript
iframe 上下滚动条如何默认在下方实现原理
2012/12/10 Javascript
javascript在当前窗口关闭前检测窗口是否关闭
2014/09/29 Javascript
详解基于Bootstrap扁平化的后台框架Ace
2015/11/27 Javascript
element上传组件循环引用及简单时间倒计时的实现
2018/10/01 Javascript
详解ES6 Promise对象then方法链式调用
2018/10/20 Javascript
使用PyInstaller将Python程序文件转换为可执行程序文件
2016/07/08 Python
Python实现字典按照value进行排序的方法分析
2017/12/23 Python
python write无法写入文件的解决方法
2019/01/23 Python
pytorch加载自定义网络权重的实现
2020/01/07 Python
Pytorch 实现focal_loss 多类别和二分类示例
2020/01/14 Python
Python sorted对list和dict排序
2020/06/09 Python
CSS3混合模式mix-blend-mode/background-blend-mode简介
2018/03/15 HTML / CSS
北美大型运动类产品商城:Champs Sports
2017/01/12 全球购物
香港草莓网土耳其网站:Strawberrynet TR
2017/03/02 全球购物
加利福尼亚州威尼斯的女性奢侈品设计师服装和概念店:Mona Moore
2018/09/13 全球购物
美国瑜伽服装和装备购物网站:Mukha Yoga
2019/02/22 全球购物
Lovedrobe官网:英国领先的大码服装品牌
2019/09/19 全球购物
工程现场管理求职自荐信
2013/10/02 职场文书
会计专业自我鉴定范文
2013/12/29 职场文书
金融学专科生自我鉴定
2014/02/21 职场文书
房地产促销活动方案
2014/03/01 职场文书
文明城市标语
2014/06/16 职场文书
创建绿色社区汇报材料
2014/08/22 职场文书
2015年大学元旦晚会活动策划书
2014/12/09 职场文书
技能培训通讯稿
2015/07/18 职场文书
描述鲁迅的名言整理,一生受用
2019/08/08 职场文书
《时代广场的蟋蟀》读后感:真挚友情,温暖世界!
2020/01/08 职场文书
React 高阶组件HOC用法归纳
2021/06/13 Javascript