So, I have initialized my var with setInterval.
I want to stop and to start it. And I wish to have this control as often as I would like to.
This is the code
<script>
var myVar = setInterval(myTimer, 1000);
function myTimer() {
var d = new Date();
var t = d.toLocaleTimeString();
document.getElementById("demo").innerHTML = t;
}
function myStopFunction() {
clearInterval(myVar);
}
function myStartFunction() {
setInterval(myTimer, 1000);
//setInterval(myVar, 1000);
}
</script>
jsfiddle.net/adeneo/g8jmccfu/1
I press "Hold" button and it's works nice. Then I click "Continue" and this works nice too. And then I click "Hold" again... and it doesn't work.
I'd like appreciate any help and any suggestions.
You forgot to reassign the new timer ID to myVar (which I called interval):
var interval = setInterval(myTimer, 1000);
function myTimer() {
// ...
}
function myStopFunction() {
clearInterval(interval);
}
function myStartFunction() {
interval = setInterval(myTimer, 1000);
}
Your variable still contained the ID of the old interval, which made clearInterval(myVar) do nothing.
Use this code, you need to define a variable
var myVar;
function myTimer() {
var d = new Date();
var t = d.toLocaleTimeString();
document.getElementById("demo").innerHTML = t;
}
function myStartFunction() {
myVar = setInterval(myTimer, 1000);
}
myStartFunction();
function myStopFunction() {
clearInterval(myVar);
}
Related
var started = false;
function start() {
var timer;
if(started === false) {
timer = setInterval(decrease, 1000);
started = true;
} else {
clearInterval(timer);
console.log("Should Clear");
}
}
The setInterval works but when I run the function again, it prints in the console that it should be removed. But it doesn't.
timer is declared inside your function, so when you call it again, it's a new instance.
Try declaring it outside the function, like this:
var started = false;
var timer;
function start() {
if(started === false) {
timer = setInterval(decrease, 1000);
started = true;
} else {
clearInterval(timer);
console.log("Should Clear");
}
}
timer gets reinitialized every time you call start so the second time you call it, it's not pointing to a timer id to clear.
use like this
var started = false;
var timer;
function start() {
if(started === false) {
timer = setInterval(decrease, 1000);
started = true;
} else {
clearInterval(timer);
console.log("Should Clear");
}
}
Because timer is in the scope of the function. So when you call it the second time, it is in another scope.
setInterval(function hello() {
console.log('hello world');
return hello;
}(), 6000);
how I can clear the interval, I tried add var interval
var i =0;
var interval = setInterval(function hello() {
console.log('world');
if(++i == 3) clearInterval(interval);
return hello;
}(), 5000);
But it didn't worked. thanks for your help.
clearInterval() certainly works. You have error in the following line of code:
}(), 5000);
//^^ remove () as this is not IIFE
var i =0;
var interval = setInterval(function hello() {
console.log('world');
if(++i == 3) clearInterval(interval);
return hello;
}(), 5000); // notice those parenthesis
you are supposed to pass a handler to setInterval() not invoke it in place ,
i'm new in js and i have created simple countdown but i want to stop it if the value of count = 0
this my script
var no;
no = 5;
$(document).ready(
function(){
timer();
var t = setInterval(timer, 1000);
var c = setInterval(cek, 1000);
}
);
function timer(){
no--;
$('.timer').html(no);
}
function cek(){
if(no===0){
alert('done');
clearInterval(t);
clearInterval(c);
}
}
Thi is the link of my script : here
You can try doing this (there is no need to create 2 async timers when you can achieve the same with only one such interval):
var t;
var no = 5;
$(document).ready(function() {
t = setInterval(function() {
timer();
cek();
}, 1000);
});
function timer() {
no--;
console.log('NO');
$('.timer').html(no);
}
function cek() {
if(no===0) {
alert('done');
clearInterval(t);
}
}
You can check an updated version of your fiddle # http://jsfiddle.net/bG8yr/5/
Simple issue, your variable was defined in the ready/anonymous function closure. I want to second the fact this is no the best way to do it. In the future inspect the fiddle and look for console errors. Its an easy way to figure out whats going wrong.
http://jsfiddle.net/cYWBL/
var no, t, c, no = 5;
$(document).ready(
function(){
timer();
t = setInterval(timer, 1000);
c = setInterval(cek, 1000);
}
);
function timer(){
no--;
$('.timer').html(no);
}
function cek(){
if(no===0){
alert('done');
clearInterval(t);
clearInterval(c);
}
}
This will do exactly what you want:
var no,
t;
no = 5;
$(document).ready(
function () {
t = setInterval(timer, 1000);
}
);
function timer() {
no--;
$('.timer').html(no);
if (no === 0) {
alert('done');
clearInterval(t);
}
}
here is the javascript code which you required. just include one if-else which is very simple. all code is your. just add if timer goes less than 0 than do nothing else coutdown.
var no;
no = 5;
$(document).ready(
function(){
timer();
var t = setInterval(timer, 1000);
var c = setInterval(cek, 1000);
}
);
function timer(){
no--;
if(no<0){ //nothing }
else{
$('.timer').html(no);
}
}
function cek(){
if(no===0){
alert('done');
clearInterval(t);
clearInterval(c);
}
}
Here is the answer
http://jsfiddle.net/bG8yr/4/
var no;
no = 5;
var isRunning=false;
$(document).ready(
function(){ isRunning=true;
timer();
var t = setInterval(timer, 1000);
var c = setInterval(cek, 1000);
}
);
function timer(){
if(isRunning){
no--;
$('.timer').html(no+":"+isRunning);
}
}
function cek(){
if(no===0&&isRunning){
isRunning=false;
alert('done');
clearInterval(t);
clearInterval(c);
}
}
Try this :
function timer(){
no--;
if (no >= 0)
$('.timer').html(no);
}
I am new to OOP in Javascript or jQuery, I am trying to clear the interval and stop any methods inside the interval, it seems not working with what I did below.
function Timer() {
var sec = $('.timer #second');
this.runTimer = function(_currentime) {
var currentTimeing = parseInt($(_currentime).text());
this.timeInterval = setInterval(function() {
$('.projects li span.second').text(currentTimeing++)
}, 1000);
$("#stop").click(function() {
// clear interval
clearInterval(this.timeInterval);
})
}
}
var play = new Timer();
$("#start").click(function(){
//console.log(this.runTimer())
play.runTimer('#second');
})
You are using this in context of different functions, that's why it's not working fine. Try:
function Timer() {
var sec = $('.timer #second');
this.runTimer = function(_currentime) {
var currentTimeing = parseInt($(_currentime).text()), that = this;
that.timeInterval = setInterval(function(){
$('.projects li span.second').text(currentTimeing ++)
}, 1000);
$("#stop").click(function(){
// clear interval
clearInterval(that.timeInterval);
})
}
}
var play = new Timer();
$("#start").click(function(){
//console.log(this.runTimer())
play.runTimer('#second');
})
I'm simply saving reference to correct this in that variable, so I can later use it to clear interval.
function Timer() {
var sec = $('.timer #second');
var timeinterval; // declare timeinterval variable here
this.runTimer = function(_currentime) {
var currentTimeing = parseInt($(_currentime).text());
timeInterval = setInterval(function(){
$('.projects li span.second').text(currentTimeing ++)
}, 1000);
$("#stop").click(function(){
// clear interval
clearInterval(timeInterval);
})
}
}
var play = new Timer();
$("#start").click(function(){
//console.log(this.runTimer())
play.runTimer('#second');
})
<span id="ccc">10</span> <span id="start">start</span> <span id="stop">stop</span>
$('#start').click(function(){
var c = $('#ccc').text();
var inter = setInterval(function() {
c--;
$('#ccc').text(c);
}, 1000);
});
$('#stop').click(function(){
clearInterval(inter);
});
how i must rewrite this for correctly use STOP?
LIVE: http://jsfiddle.net/c3hZh/
inter needs to be in-scope for both functions. Wrap both functions with a closure so that you can avoid polluting the global namespace with a new variable.
(function ($) {
var inter;
$('#start').click(function(){
var c;
c = parseInt($('#ccc').text()); //make sure you're getting a numeric value
//don't forget to clear any existing interval before setting a new one:
if (inter) {
clearInterval(inter);
}
inter = setInterval(function() {
c--;
$('#ccc').text(c);
}, 1000);
});
$('#stop').click(function() {
clearInterval(inter);
});
}(jQuery));
inter is a local variable.
It doesn't exist outside your callback.
You need to use a global variable.
var inter = 0;
$('#start').click(function(){
var c = $('#ccc').text();
inter = setInterval(function() {
c--;
$('#ccc').text(c);
}, 1000);
});
$('#stop').click(function(){
clearInterval(inter);
});