Réponses:
setInterval()
renvoie un ID d'intervalle, que vous pouvez transmettre à clearInterval()
:
var refreshIntervalId = setInterval(fname, 10000);
/* later */
clearInterval(refreshIntervalId);
Voir les documents pour setInterval()
et clearInterval()
.
clearInterval
. J'ai utilisé window.refreshIntervalId
au lieu d'une variable locale, et cela fonctionne très bien!
$('foo').data('interval', setInterval(fn, 100));
puis à le supprimer avec clearInterval($('foo').data('interval'));
Je suis sûr qu'il existe également un moyen non jQuery de le faire.
Si vous définissez la valeur de retour de setInterval
sur une variable, vous pouvez utiliser clearInterval
pour l'arrêter.
var myTimer = setInterval(...);
clearInterval(myTimer);
Vous pouvez définir une nouvelle variable et la faire incrémenter de ++ (en compter une) à chaque exécution, puis j'utilise une instruction conditionnelle pour la terminer:
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);
});
J'espère que cela aide et c'est juste.
clearInterval(varName);
. Je m'attendais clearInterval
à ne pas fonctionner une fois le nom de la fonction transmis, je pensais qu'il fallait l'ID d'intervalle. Je suppose que cela ne peut fonctionner que si vous avez une fonction nommée, car vous ne pouvez pas passer une fonction anonyme en tant que variable à l'intérieur de lui-même.
$(document).ready(function(){ });
est jQuery, c'est pourquoi cela ne fonctionne pas. Cela aurait dû être mentionné au moins.
varName
, qui stocke une fonction sans nom - wha ?? Vous devriez changer ou retirer cette réponse, à mon humble avis.
Les réponses ci-dessus ont déjà expliqué comment setInterval renvoie un descripteur et comment ce descripteur est utilisé pour annuler le temporisateur d'intervalle.
Quelques considérations architecturales:
Veuillez ne pas utiliser de variables "sans portée". Le moyen le plus sûr consiste à utiliser l'attribut d'un objet DOM. L'endroit le plus simple serait le «document». Si le rafraîchissement est démarré par un bouton marche / arrêt, vous pouvez utiliser le bouton lui-même:
<a onclick="start(this);">Start</a>
<script>
function start(d){
if (d.interval){
clearInterval(d.interval);
d.innerHTML='Start';
} else {
d.interval=setInterval(function(){
//refresh here
},10000);
d.innerHTML='Stop';
}
}
</script>
Puisque la fonction est définie à l'intérieur du gestionnaire de clic de bouton, vous n'avez pas besoin de la définir à nouveau. Le chronomètre peut être repris si le bouton est de nouveau cliqué.
document
que pour le mettre window
?
Déjà répondu ... Mais si vous avez besoin d'une minuterie en vedette, réutilisable qui prend également en charge plusieurs tâches à différents intervalles, vous pouvez utiliser mon TaskTimer (pour Node et navigateur).
// 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();
Dans votre cas, lorsque les utilisateurs cliquent pour perturber l'actualisation des données; vous pouvez également appeler timer.pause()
ensuite timer.resume()
si elles ont besoin pour réactiver.
Voir plus ici .
La méthode clearInterval () peut être utilisée pour effacer un ensemble de temporisations avec la méthode setInterval ().
setInterval renvoie toujours une valeur d'ID. Cette valeur peut être passée dans clearInterval () pour arrêter le temporisateur. Voici un exemple de temporisateur commençant à 30 et s'arrêtant quand il devient 0.
let time = 30;
const timeValue = setInterval((interval) => {
time = this.time - 1;
if (time <= 0) {
clearInterval(timeValue);
}
}, 1000);
@cnu,
Vous pouvez arrêter l'intervalle, lorsque vous essayez d'exécuter du code avant de regarder votre navigateur de console (F12) ... : P
Vérifiez par exemple une source:
var trigger = setInterval(function() {
if (document.getElementById('sandroalvares') != null) {
document.write('<div id="sandroalvares" style="background: yellow; width:200px;">SandroAlvares</div>');
clearInterval(trigger);
console.log('Success');
} else {
console.log('Trigger!!');
}
}, 1000);
<div id="sandroalvares" style="background: gold; width:200px;">Author</div>
Déclarez la variable pour affecter la valeur renvoyée par setInterval (...) et passez la variable affectée à clearInterval ();
par exemple
var timer, intervalInSec = 2;
timer = setInterval(func, intervalInSec*1000, 30 ); // third parameter is argument to called function 'func'
function func(param){
console.log(param);
}
// Partout où vous avez accès au minuteur déclaré ci-dessus, appelez clearInterval
$('.htmlelement').click( function(){ // any event you want
clearInterval(timer);// Stops or does the work
});
var keepGoing = true;
setInterval(function () {
if (keepGoing) {
//DO YOUR STUFF HERE
console.log(i);
}
//YOU CAN CHANGE 'keepGoing' HERE
}, 500);
Vous pouvez également arrêter l'intervalle en ajoutant un écouteur d'événements, disons un bouton avec l'ID "stop-interval":
$('buuton#stop-interval').click(function(){
keepGoing = false;
});
HTML:
<button id="stop-interval">Stop Interval</button>
Remarque: L'intervalle sera toujours exécuté, mais rien ne se passera cependant.
C'est ainsi que j'ai utilisé la méthode clearInterval () pour arrêter le chronomètre après 10 secondes.
function startCountDown() {
var countdownNumberEl = document.getElementById('countdown-number');
var countdown = 10;
const interval = setInterval(() => {
countdown = --countdown <= 0 ? 10 : countdown;
countdownNumberEl.textContent = countdown;
if (countdown == 1) {
clearInterval(interval);
}
}, 1000)
}
<head>
<body>
<button id="countdown-number" onclick="startCountDown();">Show Time </button>
</body>
</head>
Utilisez setTimeOut pour arrêter l'intervalle après un certain temps.
var interVal = setInterval(function(){console.log("Running") }, 1000);
setTimeout(function (argument) {
clearInterval(interVal);
},10000);
Je suppose que le code suivant vous aidera:
var refreshIntervalId = setInterval(fname, 10000);
clearInterval(refreshIntervalId);
Vous avez fait le code 100% correct ... Alors ... Quel est le problème? Ou c'est un tutoriel ...
Ajoutez simplement une classe qui indique à l'intervalle de ne rien faire. Par exemple: en vol stationnaire.
var i = 0;
this.setInterval(function() {
if(!$('#counter').hasClass('pauseInterval')) { //only run if it hasn't got this class 'pauseInterval'
console.log('Counting...');
$('#counter').html(i++); //just for explaining and showing
} else {
console.log('Stopped counting');
}
}, 500);
/* In this example, I'm adding a class on mouseover and remove it again on mouseleave. You can of course do pretty much whatever you like */
$('#counter').hover(function() { //mouse enter
$(this).addClass('pauseInterval');
},function() { //mouse leave
$(this).removeClass('pauseInterval');
}
);
/* Other example */
$('#pauseInterval').click(function() {
$('#counter').toggleClass('pauseInterval');
});
body {
background-color: #eee;
font-family: Calibri, Arial, sans-serif;
}
#counter {
width: 50%;
background: #ddd;
border: 2px solid #009afd;
border-radius: 5px;
padding: 5px;
text-align: center;
transition: .3s;
margin: 0 auto;
}
#counter.pauseInterval {
border-color: red;
}
<!-- you'll need jQuery for this. If you really want a vanilla version, ask -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="counter"> </p>
<button id="pauseInterval">Pause</button></p>
Je cherchais cette approche rapide et facile depuis des lustres, donc je poste plusieurs versions pour l'introduire autant de personnes que possible.
this.setInterval(function() { if(!$('#counter').hasClass('pauseInterval')) { //do something } }, 500);
est tout ce que vous avez pour le code. De plus, le chèque est la première chose que vous faites, il est donc très léger lorsqu'il est en vol stationnaire. C'est à cela que cela sert: suspendre temporairement une fonction . Si vous souhaitez y mettre fin indéfiniment: vous supprimez bien sûr l'intervalle.