JavaScript多种页面刷新方法小结


Posted in Javascript onApril 04, 2019

1,reload 方法

该方法强迫浏览器刷新当前页面。

语法:location.reload([bForceGet])

参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页。true, 则以 GET 方式,从服务端取最新的页面, 相当于客户端点击 F5("刷新")

2,replace 方法

方法通过指定URL替换当前缓存在历史里(客户端)的项目,因此当使用replace方法之后,你不能通过“前进”和“后退”来访问已经被替换的URL。

语法: location.replace(URL)

通常使用: location.reload() 或者是 history.go(0) 来做。

此方法类似客户端点F5刷新页面,所以页面method="post"时,会出现"网页过期"的提示。 因为Session的安全保护机制。

当调用 location.reload() 方法时, aspx页面此时在服务端内存里已经存在, 因此必定是 IsPostback 的。

如果有这种应用: 需要重新加载该页面,也就是说期望页面能够在服务端重新被创建,期望是 Not IsPostback 的。

这里,location.replace() 就可以完成此任务。被replace的页面每次都在服务端重新生成。

代码: location.replace(location.href);

返回并刷新页面:

location.replace(document.referrer);
document.referrer //前一个页面的URL

不要用 history.go(-1),或 history.back();来返回并刷新页面,这两种方法不会刷新页面。

附:Javascript刷新页面的几种方法:

history.go(0)
location.reload()
location=location
location.assign(location)
document.execCommand('Refresh')
window.navigate(location)
location.replace(location)
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.baidu.com"> (其中20指隔20秒后跳转到http://www.baidu.comt页面)

3,页面自动刷新js版

<script type="text/javascript">
function myrefresh()
{
 window.location.reload();
}
setTimeout('myrefresh()',1000); //指定1秒刷新一次
</script>

4,JS刷新框架的脚本语句

//刷新包含该框架的页面用 
<script type="text/javascript">
 parent.location.reload();
</script>
//子窗口刷新父窗口
<script type="text/javascript">
 self.opener.location.reload();
</script>
( 或 <a href="javascript:opener.location.reload()" rel="external nofollow" >刷新</a> )
//刷新另一个框架的页面用 
<script type="text/javascript">
 parent.另一FrameID.location.reload();
</script>

如果想关闭窗口时刷新或想开窗时刷新,在<body>中调用以下语句即可。

<body onload="opener.location.reload()"> 开窗时刷新
<body onUnload="opener.location.reload()"> 关闭时刷新
<script>
 window.opener.document.location.reload()
</script>

总结

以上所述是小编给大家介绍的JavaScript多种页面刷新方法小结,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
Ext javascript建立超链接,进行事件处理的实现方法
Mar 22 Javascript
JS多物体 任意值 链式 缓冲运动
Aug 10 Javascript
javascript 实现简单的table排序及table操作练习
Dec 28 Javascript
js弹窗返回值详解(window.open方式)
Jan 11 Javascript
JavaScript中this的9种应用场景及三种复合应用场景
Sep 12 Javascript
JavaScript面向对象程序设计教程
Mar 29 Javascript
js获取json中key所对应的value值的简单方法
Jun 17 Javascript
20行JS代码实现网页刮刮乐效果
Jun 23 Javascript
vue组件jsx语法的具体使用
May 21 Javascript
JS 验证码功能的三种实现方式
Nov 26 Javascript
javascript合并两个数组最简单的实现方法
Sep 14 Javascript
聊聊JS ES6中的解构
Apr 29 Javascript
详解easyui 切换主题皮肤
Apr 04 #Javascript
jQuery分组选择器简单用法示例
Apr 04 #jQuery
qrcode生成二维码微信长按无法识别问题的解决
Apr 04 #Javascript
jQuery实现带3D切割效果的轮播图功能示例【附源码下载】
Apr 04 #jQuery
vue19 组建 Vue.extend component、组件模版、动态组件 的实例代码
Apr 04 #Javascript
JS实现图片轮播效果实例详解【可自动和手动】
Apr 04 #Javascript
Vue传参一箩筐(页面、组件)
Apr 04 #Javascript
You might like
php MsSql server时遇到的中文编码问题
2009/06/11 PHP
PHP中绘制图像的一些函数总结
2014/11/19 PHP
PHP实现查询两个数组中不同元素的方法
2016/02/23 PHP
js异或加解密效果代码
2008/06/25 Javascript
JS事件Event元素(兼容IE,Firefox,Chorme)
2012/11/01 Javascript
js字符串截取函数substr substring slice使用对比
2013/11/27 Javascript
深入理解JavaScript系列(41):设计模式之模板方法详解
2015/03/04 Javascript
js简单实现标签云效果实例
2015/08/06 Javascript
学习JavaScript设计模式(多态)
2015/11/25 Javascript
JavaScript中将数组进行合并的基本方法讲解
2016/03/07 Javascript
jQuery实现点击水纹波动动画
2016/04/10 Javascript
Validform表单验证总结篇
2016/10/31 Javascript
在百度搜索结果中去除掉一些网站的资料(通过js控制不让显示)
2017/05/02 Javascript
vue2项目使用sass的示例代码
2017/06/28 Javascript
微信小程序实现人脸检测功能
2018/05/25 Javascript
微信小程序实现弹出菜单动画
2019/06/21 Javascript
layer弹出层自定义提交取消按钮的例子
2019/09/10 Javascript
python实现可变变量名方法详解
2019/07/01 Python
python设计tcp数据包协议类的例子
2019/07/23 Python
英国家电购物网站:Sonic Direct
2019/03/26 全球购物
Skyscanner香港:机票比价, 平机票和廉价航空机票预订
2020/02/07 全球购物
数据库基础的一些面试题
2012/02/25 面试题
求职简历中自我评价
2014/01/28 职场文书
高三政治教学反思
2014/02/06 职场文书
运动会稿件200字
2014/02/07 职场文书
计算机求职自荐信范文
2014/04/19 职场文书
电子商务优秀毕业生求职信
2014/07/11 职场文书
中国梦演讲稿3分钟
2014/08/19 职场文书
骨干教师申报材料
2014/12/17 职场文书
武夷山导游词
2015/02/03 职场文书
2019求职信大礼包
2019/05/15 职场文书
python 爬取天气网卫星图片
2021/06/07 Python
Java实现多线程聊天室
2021/06/26 Java/Android
mysql下的max_allowed_packet参数设置详解
2022/02/12 MySQL
alibaba seata服务端具体实现
2022/02/24 Java/Android
CentOS7安装MySQL8的超级详细教程(无坑!)
2022/06/10 Servers