js刷新iframe

简介:
JS实现刷新iframe的方法

<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','')">


代码如下:<input type=button value=刷新 onclick="history.go(0)">
代码如下:<input type=button value=刷新 onclick="location.reload()">
代码如下:<input type=button value=刷新 onclick="location=location">
代码如下:<input type=button value=刷新 onclick="window.navigate(location)">
代码如下:<input type=button value=刷新 onclick="location.replace(location)">

父页面中存在两个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); //ok
document.frames("refreshAlarm").document.location.reload(true); //ok
document.frames("refreshAlarm").document.location="/public/alarmsum.asp";//ok
document.getElementByIdx_x("refreshAlarm").src="/public/alarmsum.asp" mce_src="/public/alarmsum.asp"; //ok
document.frames("refreshAlarm").src="/public/alarmsum.asp" mce_src="/public/alarmsum.asp"; //没变化,没动静

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

这里需要补充说明的是:
采用document.getElementByIdx_x获取后reload是不可以的
但是可以这样
var myiframe = document.getElementByIdx_x("iframe1");

myiframe.src = myiframe.src; //这样同样可以起到刷新的效果。



      本文转自许琴 51CTO博客,原文链接:http://blog.51cto.com/xuqin/1223086,如需转载请自行联系原作者





相关文章
|
2月前
|
JavaScript 前端开发
前端js,vue系统使用iframe嵌入第三方系统的父子系统的通信
前端js,vue系统使用iframe嵌入第三方系统的父子系统的通信
|
7月前
|
JavaScript 索引
用原生js的postMessage实现iframe传值,也可以用于跨域嵌套iframe传值
用原生js的postMessage实现iframe传值,也可以用于跨域嵌套iframe传值
用原生js的postMessage实现iframe传值,也可以用于跨域嵌套iframe传值
|
5月前
|
JavaScript 前端开发 API
JS案例:前端Iframe及Worker通信解决思路
JS案例:前端Iframe及Worker通信解决思路
103 0
|
6月前
|
缓存 JavaScript 前端开发
老程序员分享:js刷新页面得重新加载和页面的刷新
老程序员分享:js刷新页面得重新加载和页面的刷新
48 0
|
7月前
|
缓存 移动开发 JavaScript
WKWebView对网页和js,css,png等资源文件的缓存机制及如何刷新缓存
WKWebView对网页和js,css,png等资源文件的缓存机制及如何刷新缓存
383 1
|
7月前
|
JavaScript
js实现iframe框架的面包屑功能
js实现iframe框架的面包屑功能
|
7月前
|
JavaScript
适配针式打印机EPSON爱普生,在vue项目中用原生js搭配iframe完成唤起打印弹窗
适配针式打印机EPSON爱普生,在vue项目中用原生js搭配iframe完成唤起打印弹窗
|
JavaScript
JS/JQuery操作iframe元素
JS/JQuery操作iframe元素
|
存储 移动开发 JavaScript
JS中iframe如何却写面包屑功能
JS中iframe如何却写面包屑功能
|
JavaScript 前端开发
js内联外联样式的获取,父页面获取iframe框架元素返回null
js内联外联样式的获取,父页面获取iframe框架元素返回null