停止 setInterval

我想停止 error处理程序中的这个间隔重复运行。这可能吗? 如果可能，怎么做？

// example code
$(document).on('ready',function(){
setInterval(updateDiv,3000);
});


function updateDiv(){
$.ajax({
url: 'getContent.php',
success: function(data){
$('.square').html(data);
},
error: function(){
$.playSound('oneday.wav');
$('.square').html('<span style="color:red">Connection problems</span>');
// I want to stop it here
}
});
}
255711 次浏览
小开
最佳答案

您需要将 setInterval的返回值设置为 click 处理程序范围内的一个变量，然后像下面这样使用 clearInterval():

var interval = null;
$(document).on('ready',function(){
interval = setInterval(updateDiv,3000);
});


function updateDiv(){
$.ajax({
url: 'getContent.php',
success: function(data){
$('.square').html(data);
},
error: function(){
clearInterval(interval); // stop the interval
$.playSound('oneday.wav');
$('.square').html('<span style="color:red">Connection problems</span>');
}
});
}
小开

使用一个变量并调用 clearInterval来停止它。

var interval;


$(document).on('ready',function()
interval = setInterval(updateDiv,3000);
});


function updateDiv(){
$.ajax({
url: 'getContent.php',
success: function(data){
$('.square').html(data);
},
error: function(){
$.playSound('oneday.wav');
$('.square').html('<span style="color:red">Connection problems</span>');
// I want to stop it here
clearInterval(interval);
}
});
}
小开

必须将 setInterval函数的返回值赋给一个变量

var interval;
$(document).on('ready',function(){
interval = setInterval(updateDiv,3000);
});

然后用 clearInterval(interval)再次清除它。

小开

用这个我希望能帮助你

var interval;


function updateDiv(){
$.ajax({
url: 'getContent.php',
success: function(data){
$('.square').html(data);
},
error: function(){
/* clearInterval(interval); */
stopinterval(); // stop the interval
$.playSound('oneday.wav');
$('.square').html('<span style="color:red">Connection problems</span>');
}
});
}


function playinterval(){
updateDiv();
interval = setInterval(function(){updateDiv();},3000);
return false;
}


function stopinterval(){
clearInterval(interval);
return false;
}


$(document)
.on('ready',playinterval)
.on({click:playinterval},"#playinterval")
.on({click:stopinterval},"#stopinterval");
小开 

var flasher_icon = function (obj) {
var classToToggle = obj.classToToggle;
var elem = obj.targetElem;
var oneTime = obj.speed;
var halfFlash = oneTime / 2;
var totalTime = obj.flashingTimes * oneTime;


var interval = setInterval(function(){
elem.addClass(classToToggle);
setTimeout(function() {
elem.removeClass(classToToggle);
}, halfFlash);
}, oneTime);


setTimeout(function() {
clearInterval(interval);
}, totalTime);
};


flasher_icon({
targetElem: $('#icon-step-1-v1'),
flashingTimes: 3,
classToToggle: 'flasher_icon',
speed: 500
});
.steps-icon{
background: #d8d8d8;
color: #000;
font-size: 55px;
padding: 15px;
border-radius: 50%;
margin: 5px;
cursor: pointer;
}
.flasher_icon{
color: #fff;
background: #820000 !important;
padding-bottom: 15px !important;
padding-top: 15px !important;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">


<i class="steps-icon material-icons active" id="icon-step-1-v1" title="" data-toggle="tooltip" data-placement="bottom" data-original-title="Origin Airport">alarm</i>

小开

我们可以很容易地停止设置间隔调用明确的间隔

var count = 0 , i = 5;
var vary = function intervalFunc() {
count++;
console.log(count);
console.log('hello boy');
if (count == 10) {
clearInterval(this);
}
}


setInterval(vary, 1500);

提交答案