防止 Javascript 页面重新加载答案

【问题标题】：Prevent Javascript Page Reload防止 Javascript 页面重新加载
【发布时间】：2016-11-03 21:39:14
【问题描述】：

我正在使用这个 javascript 每 30 秒自动刷新一次页面。

<script type="text/javascript">
    window.setTimeout(function(){ document.location.reload(true); }, 30000);
</script>

我需要在页面重新加载之前的任何时候为用户提供禁用此功能的选项。

注意：这是针对管理面板，而不是公共网站，并且客户端的要求是页面自动刷新，并且可以选择通过单击按钮在刷新发生之前停止刷新。

有什么方法可以实现这一点...也就是说..在执行之前禁用javascript？

【问题讨论】：

标签： javascript jquery settimeout page-refresh

【解决方案1】：

clearTimeout() ：取消先前通过调用setTimeout() 建立的超时。

您正在搜索 clearTimeout()：

var refresh = window.setTimeout(function(){ document.location.reload(true); }, 30000);

$('body').on('click', '#my-button', function(){
    clearTimeout(refresh);
})

希望这会有所帮助。

【讨论】：

好答案！ :)

【解决方案2】：

这样做：

var myVar;

function myFunction() {
    myVar = window.setTimeout(function(){ document.location.reload(true); }, 30000);
}

function myStopFunction() {
    clearTimeout(myVar);
}

您只需拨打myStopFunction 即可停止自动重新加载。

【讨论】：

【解决方案3】：

执行以下操作：

reload = window.setTimeout(function(){ document.location.reload(true); }, 30000);

或者，如果使用 jQuery，

$("#non-reload-button").click(function(){
  clearTimeOut(reload)
});

【讨论】：

【解决方案4】：

以下代码将继续每 500 毫秒执行一次，直到您单击按钮将其停止。只需将 500 替换为您想要的时间，然后将 console.log 替换为您希望运行的任何操作。希望这会有所帮助！

let auto_refresh_active = true;

const refresh = () => {
   window.setTimeout(e => {
     console.log('Hey, I am running! Click the button to stop me!')
     if(auto_refresh_active == true) refresh();
  }, 500) 
}
refresh();

document.querySelector('button').addEventListener('click', e => auto_refresh_active = false);

&lt;button&gt;stop running&lt;/button&gt;

【讨论】：