前端页面刷新

之前在做前端项目的时候经常会碰到页面状态发生改变的情况。比如:在设备解绑、解冻,或者是对用户信息进行创建、编辑、删除等操作后。原则上来说页面应该实时显示最新的信息,但是页面是通过ajax请求与数据库中的数据进行同步的。  这种情况下我们必须在这个操作的ajax回调函数中主动对页面信息进行刷新。
所谓刷新其实就行重新向后台请求数据,并将最新数据展示出来。最初我才用的刷新方法是刷新浏览器窗口的方式对数据进行同步,即window.location.reload()方法。但是这么做的弊端就是整个页面都会刷新,当前页面可能存在多个ajax请求,当整个页面刷新时,这些ajax请求都会重新发送,页面也会重新渲染,速度和性能上都不太好。
因此我又改进了我的方法。我将每个ajax请求封装到特定的function中,在我的回调函数中只调用受到影响的数据的ajax请求。这么一来不但提高了响应速度,而且页面也不会出现闪一下的状况。代码如下:


ajax(
url,
data,
function(data) {
setTimeOut(function(){
$this.doQuery();
},300);
}
);

加入timeout函数是为了在请求新数据前进行其他操作,比如显示提示信息等。若不需要,可以省去。doQuery()是我封装的一个ajax请求函数,可根据自身需要改写。

下面是一些刷新页面的方法:
window.location.reload()刷新当前页面. 
parent.location.reload()刷新父亲对象(用于框架) 
opener.location.reload()刷新父窗口对象(用于单开窗口) 
top.location.reload()刷新最顶端对象(用于多开窗口)
  • 0
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值