我正在使用setInterval(fname,10000);在JavaScript中每10秒调用一个函数。有可能在某个事件中停止调用它吗?
我希望用户能够停止重复刷新数据。
我正在使用setInterval(fname,10000);在JavaScript中每10秒调用一个函数。有可能在某个事件中停止调用它吗?
我希望用户能够停止重复刷新数据。
当前回答
您可以设置一个新变量,并让它在每次运行时递增++(加1),然后我使用一个条件语句结束它:
var intervalId = null;
var varCounter = 0;
var varName = function(){
if(varCounter <= 10) {
varCounter++;
/* your code goes here */
} else {
clearInterval(intervalId);
}
};
$(document).ready(function(){
intervalId = setInterval(varName, 10000);
});
我希望这会有所帮助,而且是正确的。
其他回答
setInterval()返回一个间隔ID,您可以将其传递给clearInterval(
var refreshIntervalId = setInterval(fname, 10000);
/* later */
clearInterval(refreshIntervalId);
请参阅setInterval()和clearInterval(()的文档。
已回答。。。但如果您需要一个功能强大、可重复使用的计时器,它还支持不同时间间隔的多个任务,您可以使用我的TaskTimer(用于节点和浏览器)。
// Timer with 1000ms (1 second) base interval resolution.
const timer = new TaskTimer(1000);
// Add task(s) based on tick intervals.
timer.add({
id: 'job1', // unique id of the task
tickInterval: 5, // run every 5 ticks (5 x interval = 5000 ms)
totalRuns: 10, // run 10 times only. (omit for unlimited times)
callback(task) {
// code to be executed on each run
console.log(task.name + ' task has run ' + task.currentRuns + ' times.');
// stop the timer anytime you like
if (someCondition()) timer.stop();
// or simply remove this task if you have others
if (someCondition()) timer.remove(task.id);
}
});
// Start the timer
timer.start();
在您的情况下,当用户单击以干扰数据刷新时;如果需要重新启用,也可以调用timer.pause(),然后调用timer.resume()。
在此处查看更多信息。
您可以设置一个新变量,并让它在每次运行时递增++(加1),然后我使用一个条件语句结束它:
var intervalId = null;
var varCounter = 0;
var varName = function(){
if(varCounter <= 10) {
varCounter++;
/* your code goes here */
} else {
clearInterval(intervalId);
}
};
$(document).ready(function(){
intervalId = setInterval(varName, 10000);
});
我希望这会有所帮助,而且是正确的。
如果将setInterval的返回值设置为变量,则可以使用clearInterval来停止它。
var myTimer = setInterval(...);
clearInterval(myTimer);
为什么不使用更简单的方法?添加一个类!
只需添加一个类,告诉间隔不要做任何事情。例如:悬停。
变量i=0;this.setInterval(函数){if(!$('#counter').hhasClass('pauseInterval')){//仅在没有此类'pauseInterval'时运行console.log('计数…');$('#counter').html(i++)//只是为了解释和展示}其他{console.log(“停止计数”);}}, 500);/*在本例中,我在mouseover上添加一个类,并在mouseleft上再次删除它。你当然可以为所欲为*/$('#counter').holl(function(){//鼠标输入$(this).addClass('原因间隔');},function(){//鼠标离开$(this).removeClass('原因间隔');});/*其他示例*/$('#pauseInterval').click(function(){$('#counter').tggleClass('auseInterval');});正文{背景色:#eee;font-family:Calibri,Arial,sans-serif;}#计数器{宽度:50%;背景:#ddd;边框:2px实心#009afd;边界半径:5px;填充:5px;文本对齐:居中;转换:.3s;边距:0自动;}#counter.use间隔{边框颜色:红色;}<!-- 为此,您需要jQuery。如果您真的想要香草版本,请询问--><script src=“https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js“></script><p id=“counter”></p><button id=“pauseInterval”>暂停</button></p>
多年来,我一直在寻找这种快速而简单的方法,所以我发布了几个版本,以尽可能多地向人们介绍这种方法。