`

Javascript刷新当前页

阅读更多

 

Javascript 刷新当前页

 

下面以三个页面分别命名为frame.htmltop.htmlbottom.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>
 

 

对于一些 tab 页有时候需要使用

window.location.href = window.location.href;

 

 

-EOF-

 

分享到:
评论

相关推荐

    【JavaScript源代码】vue列表数据删除后主动刷新页面及刷新方法详解.docx

     前端删除一条数据或者新增数据后,后端操作成功,但前端不会自动刷新,需要重新刷新当前页面 (用vue-router重新路由到当前页面,页面是不进行刷新的 ,采用window.reload(),或者router.go(0)刷新时,整个浏览器...

    js刷新当前页面的几种方法(相当牛X)

    参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页。true, 则以 GET 方式,从服务端取最新的页面, 相当于客户端点击 F5("刷新") 2,replace 方法,该方法通过指定URL替换当前缓存在历史里...

    JavaScript刷新页面的几种方法总结

    该方法强迫浏览器刷新当前页面。 语法:location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页。true, 则以 GET 方式,从服务端取最新的页面, 相当于客户端点击 F5(...

    用js来刷新当前页面保留参数的具体实现

    其中还有js的刷新,不是很会弄,于是记录下, reload 方法,该方法强迫浏览器刷新当前页面。 语法: location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页。true, 则...

    JavaScript多种页面刷新方法小结

    该方法强迫浏览器刷新当前页面。 语法:location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页。true, 则以 GET 方式,从服务端取最新的页面, 相当于客户端点击 F5(...

    JS刷新当前页面的几种方法总结

    reload 方法,该方法强迫浏览器刷新当前页面。 语法:location.reload([bForceGet])  参数:bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页。true, 则以 GET 方式,从服务端取最新的页面, 相当于...

    移动端H5页面返回并刷新页面(BFcache)的方法

    而对于浏览器来说,大部分浏览器的返回是直接使用缓存的,不会执行任何的javascript代码。原因:部分浏览器在后退时不会触发onload事件,這是HTML5世代浏览器新增的特性之一——Back-Forward Cache(简称bfcache) ...

    基于JavaScript判断浏览器到底是关闭还是刷新(超准确)

    //页面刷新时,刷新之前执行onbeforeunload事件,在新页面即将替换旧页面时onunload事件,最后onload事件。 //页面关闭时,先onbeforeunload事件,再onunload事件。 //对于火狐: //页面刷新时,只执行onunload;...

    a链接刷新页面与js刷新页面用法示例介绍

    复制代码代码如下: 返回上一页&lt;/a&gt; 刷新当前页&lt;/a&gt; #top的效果在我这没起作用,我直接写的刷新当前页倒是起作用了。 2.、JS怎么刷新当前页面 reload 方法,该方法强迫浏览器刷新当前页面。 语法:location.reload...

    javascript 页面只自动刷新一次

    //把当前页面的地址赋给变量 url var times = url.split(“?”); //分切变量 url 分隔符号为 “?” if(times[1] != 1){ //如果?后的值不等于1表示没有刷新 url += “?1”; //把变量 url 的值加入 ?1 self.location....

    一套基于jQuery实现的无刷新在线查单词功能源码例子

    一套基于jQuery实现的无刷新在线查单词功能源码例子

    javascript跳转与返回和刷新页面的实例代码

    [removed] 是 window 对象的属性,用来替换当前页,也就是重新定位当前页 而window.open 是 window 对象的方法,是用来打开一个新窗口的函数 // 打开新页面 // 注意:有些浏览器的安全设置会将

    javascript关于open.window子页面执行完成后刷新父页面的问题分析

    本文实例分析了javascript关于open.window子页面执行完成后刷新父页面的方法。分享给大家供大家参考。具体分析如下: 主页面: &lt;input id=btnAdd type=button onclick=openWin(); value=添加 /&gt; 在js中有如下...

    js中页面的重新加载(当前页面/上级页面)及frame或iframe元素引用介绍

    用JavaScript刷新上级页面和当前页面 代码如下: [removed] //刷新上级页面 //window.parent.main.[removed].reload(); //刷新当前页面 [removed].reload(); [removed] 每个frame元素或者iframe元素就是一个框架,这个...

    程序天下:JavaScript实例自学手册

    19.18 打印当前页 19.19 打印预览 19.20 隐藏不想打印的页面内容 19.21 使用ExecWB直接打印 19.22 动态绑定XML文件 19.23 Kill Excel的进程 第20章 调用操作系统的应用 20.1 Javascript操作剪贴板 20.2 打开硬盘驱动...

    不刷当前jsp页面上传文件的实例

    在jsp中不刷新页面上传文件,并且可以设置上传文件的格式,不符合预定格式的文件可以过滤

    javaScript实例自学手册486例,附带目录可方便搜索

    1.29 页内跳转.htm 1.3 页面自动刷新.htm 1.30 代码测试页面.htm 1.31 屏幕式左右拉开页面的效果.htm 1.32 下雨的页面.htm 1.33 页面背景颜色渐变.htm 1.34 自动滚屏.htm 1.35 在页面中画点.htm 1.36 页面...

    Javascript实现倒计时(防页面刷新)实例

    话不多说,请看实例代码 &lt;!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&gt; &lt;... &lt;head&gt; &lt;meta ...SCRIPT

    javascript showModalDialog 多层模态窗口实现页面提交及刷新的代码

    在第N(N&gt;1)层的模态页面中,如果想链接到其他页面或者刷新当前页,只能用 window.name = “__self”; window.open[removed].href, “__self”) //注意是2个下划线 替换 location.href 当需要关闭第N(N&gt;1)层的模态...

    JavaScript基础教程第8版

    11.1 在网页上显示当前日期 206 11.2 处理周中的日期 208 11.3 根据时间对消息进行定制 209 11.4 根据时区显示日期 210 11.5 把24小时制转换为12小时制 213 11.6 创建倒数计数器 216 11.7 隐藏和显示层...

Global site tag (gtag.js) - Google Analytics