Js 刷新框架页的代码


Posted in Javascript onApril 13, 2010

先来看一个简单的例子:
下面以三个页面分别命名为frame.html、top.html、bottom.html为例来具体说明如何做。
frame.html 由上(top.html)下(bottom.html)两个页面组成,代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> frame </TITLE> 
</HEAD> 
<frameset rows="50%,50%"> 
<frame name=top src="top.html"> 
<frame name=bottom src="bottom.html"> 
</frameset> 
</HTML>

现在假设top.html (即上面的页面) 有七个button来实现对bottom.html (即下面的页面) 的刷新,可以用以下七种语句,哪个好用自己看着办了。
语句1. window.parent.frames[1].location.reload();
语句2. window.parent.frames.bottom.location.reload();
语句3. window.parent.frames["bottom"].location.reload();
语句4. window.parent.frames.item(1).location.reload();
语句5. window.parent.frames.item('bottom').location.reload();
语句6. window.parent.bottom.location.reload();
语句7. window.parent['bottom'].location.reload();

top.html 页面的代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> top.html </TITLE> 
</HEAD> 
<BODY> 
<input type=button value="刷新1" onclick="window.parent.frames[1].location.reload()"><br> 
<input type=button value="刷新2" onclick="window.parent.frames.bottom.location.reload()"><br> 
<input type=button value="刷新3" onclick="window.parent.frames['bottom'].location.reload()"><br> 
<input type=button value="刷新4" onclick="window.parent.frames.item(1).location.reload()"><br> 
<input type=button value="刷新5" onclick="window.parent.frames.item('bottom').location.reload()"><br> 
<input type=button value="刷新6" onclick="window.parent.bottom.location.reload()"><br> 
<input type=button value="刷新7" onclick="window.parent['bottom'].location.reload()"><br> 
</BODY> 
</HTML>

下面是bottom.html页面源代码,为了证明下方页面的确被刷新了,在装载完页面弹出一个对话框。

bottom.html 页面的代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> bottom.html </TITLE> 
</HEAD> 
<BODY onload="alert('我被加载了!')"> 
<h1>This is the content in bottom.html.</h1> 
</BODY> 
</HTML>

解释一下:
1.window指代的是当前页面,例如对于此例它指的是top.html页面。
2.parent指的是当前页面的父页面,也就是包含它的框架页面。例如对于此例它指的是framedemo.html。
3.frames是window对象,是一个数组。代表着该框架内所有子页面。
4.item是方法。返回数组里面的元素。
5.如果子页面也是个框架页面,里面还是其它的子页面,那么上面的有些方法可能不行。

附:
Javascript刷新页面的几种方法:
1 history.go(0)
2 location.reload()
3 location=location
4 location.assign(location)
5 document.execCommand('Refresh')
6 window.navigate(location)
7 location.replace(location)
8 document.URL=location.href

自动刷新页面的方法:
1.页面自动刷新:把如下代码加入<head>区域中
<meta http-equiv="refresh" content="20">
其中20指每隔20秒刷新一次页面.

2.页面自动跳转:把如下代码加入<head>区域中
<meta http-equiv="refresh" content="20;url=HTTP://www。wyxg。com">
其中20指隔20秒后跳转到HTTP://www。wyxg。com页面

3.页面自动刷新js版
<script language="JavaScript">
function myrefresh()
{
window.location.reload();
}
setTimeout('myrefresh()',1000); //指定1秒刷新一次
</script>

ASP.NET如何输出刷新父窗口脚本语句

1. this.response.write("<script>opener.location.reload();</script>"); 
2. this.response.write("<script>opener.window.location.href = opener.window.location.href;</script>"); 
3. Response.Write("<script language=javascript>opener.window.navigate(''你要刷新的页.asp'');</script>")

JS刷新框架的脚本语句
//如何刷新包含该框架的页面用 
<script language=JavaScript> 
parent.location.reload(); 
</script> 
//子窗口刷新父窗口 
<script language=JavaScript> 
self.opener.location.reload(); 
</script> 
( 或 <a href="javascript:opener.location.reload()">刷新</a> ) 
//如何刷新另一个框架的页面用 
<script language=JavaScript> 
parent.另一FrameID.location.reload(); 
</script> 
如果想关闭窗口时刷新或者想开窗时刷新的话,在<body>中调用以下语句即可。 
<body onload="opener.location.reload()"> 开窗时刷新 
<body onUnload="opener.location.reload()"> 关闭时刷新 
<script language="javascript"> 
window.opener.document.location.reload() 
</script>

//如果都不行试以下
Response.Write("<script language=javascript>window.opener.location.reload();window.close();</script>");
下面是几个可以参考的文章:
js刷新框架子页面的七种方法代码

JS与框架页的操作代码

Javascript 相关文章推荐
根据判断浏览器类型屏幕分辨率自动调用不同CSS的代码
Feb 22 Javascript
jquery图片切换插件
Mar 16 Javascript
在JavaScript中操作时间之setYear()方法的使用
Jun 12 Javascript
基于javascript实现句子翻牌网页版小游戏
Mar 23 Javascript
JavaScript判断数字是否为质数的方法汇总
Jun 02 Javascript
完美解决spring websocket自动断开连接再创建引发的问题
Mar 02 Javascript
jQuery 表单序列化实例代码
Jun 11 jQuery
微信小程序 新建登录页并实现tabBar隐藏
Jun 13 Javascript
微信小程序 上传头像的实例详解
Oct 27 Javascript
详解小程序退出页面时清除定时器
Apr 28 Javascript
js 动态校验开始结束时间的实现代码
May 25 Javascript
微信小程序地图实现展示线路
Jul 29 Javascript
百度Popup.js弹出框进化版 拖拽小框架发布 兼容IE6/7/8,Firefox,Chrome
Apr 13 #Javascript
JavaScript在IE和Firefox(火狐)的不兼容问题解决方法小结
Apr 13 #Javascript
JavaScript 数组运用实现代码
Apr 13 #Javascript
关于Jqzoom的使用心得 jquery放大镜效果插件
Apr 12 #Javascript
Javascript 判断Flash是否加载完成的代码
Apr 12 #Javascript
使用dynatrace-ajax跟踪JavaScript的性能
Apr 12 #Javascript
javascript URL编码和解码使用说明
Apr 12 #Javascript
You might like
玩家交还《星际争霸》原始码光盘 暴雪报以厚礼
2017/05/05 星际争霸
探讨如何使用SimpleXML函数来加载和解析XML文档
2013/06/07 PHP
浅谈PHP中foreach/in_array的使用
2015/11/02 PHP
一段实用的php验证码函数
2016/05/19 PHP
PHP版单点登陆实现方案的实例
2016/11/17 PHP
PHP new static 和 new self详解
2017/02/19 PHP
在 Laravel 中 “规范” 的开发短信验证码发送功能
2017/10/26 PHP
PHP实现与java 通信的插件使用教程
2019/08/11 PHP
php实现大文件断点续传下载实例代码
2019/10/01 PHP
JQuery调webservice实现邮箱验证(检测是否可用)
2013/05/21 Javascript
jQuery使用hide方法隐藏页面上指定元素的方法
2015/03/30 Javascript
jQuery简单实现图片预加载
2015/04/20 Javascript
js 将图片连接转换成base64格式的简单实例
2016/08/10 Javascript
easyui-datagrid开发实践(总结)
2017/08/02 Javascript
JQuery 选择器、DOM节点操作练习实例
2017/09/28 jQuery
JS实现的哈夫曼编码示例【原始版与修改版】
2018/04/22 Javascript
vue.js实现回到顶部动画效果
2019/07/31 Javascript
vue中@change兼容问题详解
2019/10/25 Javascript
javscript 数组扁平化的实现
2020/02/03 Javascript
js面向对象方式实现拖拽效果
2021/03/03 Javascript
在Django中创建URLconf相关的通用视图的方法
2015/07/20 Python
python append、extend与insert的区别
2016/10/13 Python
Python实现网站注册验证码生成类
2017/06/08 Python
python的格式化输出(format,%)实例详解
2018/06/01 Python
Python 数值区间处理_对interval 库的快速入门详解
2018/11/16 Python
详解Windows下PyCharm安装Numpy包及无法安装问题解决方案
2020/06/18 Python
tensorflow 大于某个值为1,小于为0的实例
2020/06/30 Python
科颜氏英国官网:Kiehl’s英国
2019/11/20 全球购物
给校长的建议书300字
2014/05/16 职场文书
村居抓节水倡议书
2014/05/19 职场文书
煤矿安全承诺书
2014/05/22 职场文书
2016春节家属慰问信
2015/03/25 职场文书
闭幕词的写作格式与范文!
2019/06/24 职场文书
Nginx的rewrite模块详解
2021/03/31 Servers
golang 接口嵌套实现复用的操作
2021/04/29 Golang
Jupyter notebook 更改文件打开的默认路径操作
2021/05/21 Python