阻止 Javascript 页面重新加载

Question

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

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

我需要给用户一个选项，让用户可以在页面重新加载之前随时禁用此功能。

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

有什么办法可以做到这一点......也就是说..在执行之前禁用javascript？

Answer 1

clearTimeout() : Cancels a timeout previously established by calling setTimeout().

您正在搜索 clearTimeout() :

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

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

希望对您有所帮助。

Answer 2

执行以下操作：

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

或者，如果使用 jQuery，

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

Answer 3

这样做：

var myVar;

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

function myStopFunction() {
    clearTimeout(myVar);
}

您只需调用 myStopFunction 即可停止自动重新加载。

Answer 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);

<button>stop running</button>

阻止 Javascript 页面重新加载

Prevent Javascript Page Reload

javascript

jquery

settimeout

page-refresh