Javascript jQuery - 如何在用 clearInterval 关闭后重新启动 setInterval？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4986667/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery - How to restart setInterval after killing it off with clearInterval?
提问by Pritesh Desai
I want to create a page with 2 buttons, 'STAY' and 'Leave'. There is an iFrame underneath the buttons. When the page loads for the first time, the iFrame starts refreshing automatically after 10 secs. When the user hits STAY button, it will stop refreshing. After that if he hits LEAVE button the iFrame will again start refreshing after 10 secs. I'm using this code:
我想创建一个带有 2 个按钮的页面，“STAY”和“Leave”。按钮下方有一个 iFrame。当页面第一次加载时，iFrame 会在 10 秒后自动开始刷新。当用户点击 STAY 按钮时，它将停止刷新。之后，如果他点击 LEAVE 按钮，iFrame 将在 10 秒后再次开始刷新。我正在使用此代码：
$(document).ready(function() {
var refreshIntervalId = setInterval( "update()", 10000 );
$('#leave').click(function () {
var refreshIntervalId = setInterval( "update()", 10000 );;
})
$('#stay').click(function () {
clearInterval(refreshIntervalId);
})
});
function update(){
var url = "load.php";
$('iframe#ifrm').attr('src', url);
}
<div id="bar">
<div class= "button" id="stay">
<a>Stay</a>
</div>
<div class= "button" id="leave">
<a>Leave</a>
</div>
</div>
but it doesn't work, am I using clearInterval in the wrong way?
但它不起作用，我是否以错误的方式使用 clearInterval ？
回答by rcravens
I think you need to pull the set interval id outside of the function scope.
我认为您需要将设置的间隔 id 拉到函数范围之外。
var refreshIntervalId;
$('#leave').click(function () {
refreshIntervalId = setInterval( update, 10000 );
})
$('#stay').click(function () {
clearInterval(refreshIntervalId);
})
});
Maybe some validation checking on the refreshIntervalId variable also...
也许还对 refreshIntervalId 变量进行了一些验证检查...
if(refreshIntervalId!=null){
// Do something with the interval id
}
回答by Yoram de Langen
First of all you can't define a variable in the #leaveclick function and use it in the #stayclick function.
首先你不能在#leaveclick函数中定义一个变量并在click函数中使用它#stay。
Use it like this:
像这样使用它：
var refreshIntervalId = null;
$('#leave').click(function () {
refreshIntervalId = setInterval( "update()", 10000 );
})
$('#stay').click(function () {
clearInterval(refreshIntervalId);
})
回答by IttyBittyArtist
It's a scope issue. That means that wherever you put the "var" at defines what functions have access to the variable. If you define the variable outside of all of the functions like in Tricker's example, any function in your document has access to that value.
这是一个范围问题。这意味着无论您将“var”放在何处，都定义了哪些函数可以访问该变量。如果像 Tricker 的示例那样在所有函数之外定义变量，则文档中的任何函数都可以访问该值。
Tricker's example previously posted:
之前发布的 Tricker 示例：
var refreshIntervalId = null;
$('#leave').click(function () {
refreshIntervalId = setInterval( "update()", 10000 );
})
$('#stay').click(function () {
clearInterval(refreshIntervalId);
})
Sometimes the whole document doesn't need to have access to the variable, so you want to put it inside of a function.
有时整个文档不需要访问变量，所以你想把它放在一个函数中。
