本文汇总了JavaScript中实现页面自动刷新与跳转的多种技术方案。涵盖利用history对象控制浏览器历史记录的返回与前进操作,通过location属性或meta标签实现定时刷新及指定URL跳转,以及针对父窗口、子窗口和框架页面的特定刷新脚本。内容包含HTML5标准推荐做法与部分传统兼容写法,供开发者根据实际需求选择。
利用History对象控制页面返回与前进
使用JavaScript返回上一页,可调用history.go(-1);若需返回前两个页面,则使用history.go(-2)。
另一种返回上一页的方式是调用history.back()。
调用window.history.forward()可实现返回下一页的操作。
window.history.go()方法支持传入整数参数以返回指定历史页码,也可直接传入访问过的URL地址。
具体应用示例如下:
代码实现如下:
<a href="javascript:history.go(-1);">向上一页</a>
response.Write("<script language=javascript>")
response.Write("if(!confirm('完成任务?')){history.back();}")
response.Write("</script>")
response.Write("<script language=javascript>history.go(-1);</script>")
<a href="javascript:history.go(-1);">向上一页</a>
关于页面跳转的实现方式:
onclick="window.location.href='list.aspx'"补充说明:
小技巧(JS引用JS):
代码片段如下:
<script type=text/javascript>
<!--
if (typeof SWFObject == "undefined") {
document.write('<scr' + 'ipt type="text/javascript" src="/scripts/swfobject-1.5.js"></scr' + 'ipt>');}
//-->
</script>JavaScript实现页面刷新的多种方案
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自动刷新页面的方法:
使用Meta标签实现自动刷新与跳转
1. 页面自动刷新:将以下代码添加至<head>区域中
<meta http-equiv="refresh" content="20">
其中20表示每隔20秒刷新一次当前页面。
2. 页面自动跳转:将以下代码添加至<head>区域中
<meta http-equiv="refresh" content="20;url=https://www.jb51.net">
其中20表示隔20秒后跳转到https://www.jb51.net/tools/files.shtml页面。
JavaScript定时刷新页面的实现
3. 使用JavaScript实现页面自动刷新:
代码示例如下:
<script language="JavaScript">
function myrefresh()
{
window.location.reload();
}
setTimeout('myrefresh()',1000); //指定1秒刷新一次
</script>ASP.NET刷新父窗口脚本
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>