Question

可能重复：
Automatic page refresh

我在网上找到了这个开关，想用它来刷新页面。如果用户单击“打开”，它将每5秒刷新一次页面。如果他们点击它将停止。有些人可以帮帮我。这是我到目前为止所做的：

<style>



body{
font-family:Verdana, Geneva, sans-serif;
font-size:14px;}

.left{
float:left;
width:120px;}

#ajax{
float:left;
width:300px;
padding-top:5px;
font-weight:700;
}

.clear{clear:both;}

</style>

</head>

<body>


</a></div>
<div id="container">


 <div class="left" id="1"></div>
 <div id="ajax"></div>
  <div class="clear"></div>

  <script type="text/javascript">

    $('#1').iphoneSwitch("on", 
     function() {
       $('#ajax').load('on.html');
      },
      function() {
       $('#ajax').load('off.html');
      },
      {
        switch_on_container_path: 'iphone_switch_container_off.png'
      });
  </script>

Answer 1

为什么不使用简单的超时javascript函数，例如：

<script type="text/JavaScript">
    var timeoutPeriod = 5000;
    function timedRefresh(timeoutPeriod) {
        setTimeout("location.reload(true);",timeoutPeriod);
    }

</script>

您可以添加逻辑，仅在单击on开关时运行此命令。

Answer 2

您可以启用和禁用页面刷新，如下所示：

var refreshTimer;

$('#button').iphoneSwitch("on", 
    function() {
        refreshTimer = setTimeout(function(){ location.reload(true); }, 5000);
    },
    function() {
        clearTimeout(refreshTimer);
    },
    {
        switch_on_container_path: 'iphone_switch_container_off.png'
    }
);

如果你想使用ajax重新加载一些html，你可以使用这样的东西（使用setInterval）：

var refreshTimer;

function ajaxReload()
{
    $.ajax .. etc
}

$('#button').iphoneSwitch("on", 
    function() {
        refreshTimer = setInterval(ajaxReload, 5000);
    },
    function() {
        clearInterval(refreshTimer);
    },
    {
        switch_on_container_path: 'iphone_switch_container_off.png'
    }
);

修改

在此示例页面中，默认情况下会禁用重新加载，当用户使用按钮启用它时，它将一直处于停用状态

var refreshTimer; function enableTimer() { refreshTimer = setTimeout(function(){ location.reload(true); }, 5000); window.location.hash = "#autoreload"; } function disableTimer() { clearTimeout(refreshTimer); window.location.hash = ""; } $(function() { $('#button').iphoneSwitch( (window.location.hash == "#autoreload" ? "on" : "off"), enableTimer, disableTimer ); if (window.location.hash == "#autoreload") enableTimer(); });

如何自动刷新页面

2 个答案: