JS之页面自动刷新,用于需要实时更新页面

 没想到挺多人访问的,现在把方法优化一下。

下面这个是可以控制时间和手动开启关闭的页面定时自动刷新方法:


<script type="text/javascript">
var i=0
var timer=null;
var status='N';
   
   $(document).ready(function(){ 
    myFresh();
}); 
      
      
      function myFresh(){
      if(status=='Y'){
        i=0;
        $("#fresh").html('已关闭自动刷新');
        $("#timeFresh").html("开启自动刷新");
        status='N';
        clearInterval(timer); 
        }else if(status=='N'){
        status='Y';
        $("#fresh").html('第<span id="fresh_desc" style="font-size: 16px; color: red;">0</span>秒,20秒后自动刷新');
        $("#timeFresh").html("关闭自动刷新");
         timer=setInterval(function(){
          i++;
          $("#fresh_desc").html(i);
          if(i==20){
          clearInterval(timer);  
          location.reload();
          }
       },1000);  
        }
      }
      
       function fresh(){
      location.reload();
      }
      
</script>


jsp页面上:<div style="float:right; margin-right:20px;">
<span id="fresh">第<span id="fresh_desc" style="font-size: 16px; color: red;">0</span>秒,20秒后自动刷新</span>
    <button type="button" οnclick="myFresh();" id="timeFresh" class='btn btn-mini btn-info'>关闭自动</button>
    <button type="button" οnclick="fresh();" id="" class='btn btn-mini btn-info'>手动刷新</button></div>



这样子就可以实现随意开关自动刷新页面了  。


下面的是不能控制开启关闭的方法,简单易用,仅供参考。

自动刷新页面的方法:

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

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

3.页面自动刷新js版

<script language="JavaScript">
function myrefresh()
{
       window.location.reload();
}
setTimeout('myrefresh()',1000); //指定1秒刷新一次
</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 οnlοad="opener.location.reload()"> 开窗时刷新
<body onUnload="opener.location.reload()"> 关闭时刷新

<script language="javascript">
window.opener.document.location.reload()
</script>





  • 1
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值