js实现刷新iframe的方法汇总


Posted in Javascript onApril 27, 2015

javascript实现刷新iframe的方法的总结,现在假设存在下面这样一个iframe,则刷新该iframe的N种方法有:

<iframe src="1.htm" name="ifrmname" id="ifrmid"></iframe>

第一种方法:用iframe的name属性定位

<input type="button" name="Button" value="Button" onclick="document.frames('ifrmname').location.reload()">

或者

<input type="button" name="Button" value="Button" onclick="document.all.ifrmname.document.location.reload()">

第二种方法:用iframe的id属性定位

<input type="button" name="Button" value="Button" onclick="ifrmid.window.location.reload()">

第三种方法:当iframe的src为其它网站地址(即跨域操作时)

<input type="button" name="Button" value="Button" onclick="window.open(document.all.ifrmname.src,'ifrmname','')">

父页面中存在两个iframe,一个iframe中是一个链接列表,其中的链接指向另一个iframe,用于显示内容。现在当内容内容添加后,在链接列表中添加了一条记录,则需要刷新列表iframe。
在内容iframe的提交js中使用parent.location.reload()将父页面全部刷新,因为另一个iframe没有默认的url,只能通过列表选择,所以只显示了列表iframe的内容。
使用window.parent.frames["列表iframe名字"].location="列表url"即可进刷新列表iframe,而内容iframe在提交后自己的刷新将不受影响。

document.frames("refreshAlarm").location.reload(true); 

document.frames("refreshAlarm").document.location.reload(true); 

document.frames("refreshAlarm").document.location="https://3water.com/"; 

document.frames("refreshAlarm").src="https://3water.com/";

注意区别:document.all.refreshAlarm 或 document.frames("refreshAlarm") 得到的是https://3water.com/页面中那个iframe标签,所以对src属性操作有用。
document.frames("refreshAlarm").document得到iframe里面的内容,也就是"https://3water.com/"中的内容。

javascript(js)自动刷新页面的实现方法总结:

间隔10秒刷新一次,在页面的head标签中加入下面的代码段:

<meta http-equiv="refresh"content="10;url=跳转的页面或者是需要刷新的页面URL地址">

定时刷新页面(间隔2秒刷新一下页面):

<script language="javascript"> 

setTimeout("location.href='url'",2000);//url是要刷新的页面URL地址 

</script>

直接刷新页面事件:

<script language="javascript"> 

window.location.reload(true); 

//如需刷新iframe,则只需把window替换为响应的iframe的name属性值或ID属性值 

</script>

直接刷新页面事件:

<script language=''javascript''> 

window.navigate("本页面url"); 

</script>

直接刷新页面事件:

function abc(){ 

window.location.href="/blog/window.location.href"; 

setTimeout("abc()",10000); 

}

刷新框架页:

<script language="javascript"> 

top.leftFrm.location.reload(); 

parent.frmTop.location.reload(); 

</script>

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
jquery随意添加移除html的实现代码
Jun 21 Javascript
JQuery页面图片切换和新闻列表滚动效果的具体实现
Sep 26 Javascript
Extjs grid panel自带滚动条失效的解决方法
Sep 11 Javascript
PHP+MySQL+jQuery随意拖动层并即时保存拖动位置实例讲解
Oct 09 Javascript
js replace(a,b)之替换字符串中所有指定字符的方法
Aug 17 Javascript
利用jQuery插件imgAreaSelect实现图片上传裁剪(同步显示图像位置信息)
Dec 02 Javascript
Reactjs实现通用分页组件的实例代码
Jan 19 Javascript
用户管理的设计_jquery的ajax实现二级联动效果
Jul 13 jQuery
BootStrap入门学习第一篇
Aug 28 Javascript
VueJs组件之父子通讯的方式
May 06 Javascript
解决webpack dev-server不能匹配post请求的问题
Aug 24 Javascript
微信小程序 腾讯地图SDK 获取当前地址实现解析
Aug 12 Javascript
JavaScript数组和循环详解
Apr 27 #Javascript
javascript实现全局匹配并替换的方法
Apr 27 #Javascript
js限制文本框只能输入整数或者带小数点的数字
Apr 27 #Javascript
如何使用HTML5地理位置定位功能
Apr 27 #Javascript
jQuery插件scroll实现无缝滚动效果
Apr 27 #Javascript
Javascript非构造函数的继承
Apr 27 #Javascript
JQuery选中checkbox方法代码实例(全选、反选、全不选)
Apr 27 #Javascript
You might like
PHP实现Socket服务器的代码
2008/04/03 PHP
PHP中static关键字原理的学习研究分析
2011/07/18 PHP
单台服务器的PHP进程之间实现共享内存的方法
2014/06/13 PHP
10个简化PHP开发的工具
2014/12/25 PHP
HTML5附件拖拽上传drop &amp; google.gears实现代码
2011/04/28 Javascript
解决遍历时Array.indexOf产生的性能问题
2012/07/03 Javascript
jquery form 隐藏的input 选择
2014/04/29 Javascript
jquery中checkbox全选失效的解决方法
2014/12/26 Javascript
JavaScript中的console.log()函数详细介绍
2014/12/29 Javascript
z-blog SyntaxHighlighter 长代码无法换行解决办法(基于jquery)
2015/11/18 Javascript
JavaScript中的函数(二)
2015/12/23 Javascript
jQuery Ajax 全局调用封装实例代码详解
2016/06/02 Javascript
jQuery leonaScroll 1.1 自定义滚动条插件(推荐)
2016/09/17 Javascript
React Native中的RefreshContorl下拉刷新使用
2017/10/09 Javascript
JS交互点击WKWebView中的图片实现预览效果
2018/01/05 Javascript
jQuery简单判断值是否存在于数组中的方法示例
2018/04/17 jQuery
node.js 模块和其下载资源的镜像设置的方法
2018/09/06 Javascript
关于JavaScript中异步/等待的用法与理解
2020/11/18 Javascript
[15:28]DOTA2 HEROS教学视频教你分分钟做大人-剧毒术士
2014/06/13 DOTA
[40:13]Ti4 冒泡赛第二天 iG vs NEWBEE 2
2014/07/15 DOTA
新手入门Python编程的8个实用建议
2019/07/12 Python
使用python-pptx包批量修改ppt格式的实现
2020/02/14 Python
python梯度下降算法的实现
2020/02/24 Python
keras小技巧——获取某一个网络层的输出方式
2020/05/23 Python
python 制作本地应用搜索工具
2021/02/27 Python
使用CSS3的appearance属性改变任何元素的浏览器默认风格
2012/12/24 HTML / CSS
HTML5 本地存储之如果没有数据库究竟会怎样
2013/04/25 HTML / CSS
在线购买廉价折扣书籍和小说:BookOutlet.com
2018/02/19 全球购物
皇家阿尔伯特英国官方商店:Royal Albert骨瓷
2019/03/25 全球购物
几个SQL的面试题
2014/03/08 面试题
代理协议书范本
2014/04/22 职场文书
研究生导师推荐信
2015/03/25 职场文书
2016年会开场白台词
2015/06/01 职场文书
入党宣誓仪式主持词
2015/06/29 职场文书
2016年3月份红领巾广播稿
2015/12/21 职场文书
python中sqllite插入numpy数组到数据库的实现方法
2021/06/21 Python