What is the problem in this timer [JS]
What is the problem in this timer [JS]
<script type="text/javascript">
var remain = "14:14";
setInterval ("timer()", 660);
function timer(){
var remainM = parseInt(remain.split(":")[0]);
var remainS = parseInt(remain.split(":")[1]);
//document.getElementById("hello").innerHTML = parseInt(remainS);
if (remainS==0) {
if (remainM==0) {
} else {
remainM = parseInt(remainM) - 1;
remainS = 59;
}
} else {
remainS = parseInt(remainS) - 1;
}
var remainSr = String(remainS);
var remainMr = String(remainM);
if (parseInt(remainS)<=9) {remainSr = "0" + String(remainS);}
if (parseInt(remainM)<=9) {remainMr = "0" + String开发者_开发问答(remainM);}
remain = String(remainMr) + ":" + String(remainSr);
document.getElementById("hello").innerHTML = remain;
}
</script>
It jumps from 14:09 to 13:59
It is historical mistake made by ignoring the second parameter of parseInt.
Check this article: http://www.devguru.com/technologies/ecmascript/quickref/parseint.html
Try this version:
<script type="text/javascript">
var remain = "14:14";
setInterval("timer()", 660);
function timer() {
var remainM = parseInt(remain.split(":")[0], 10);
var remainS = parseInt(remain.split(":")[1], 10);
if (remainS == 0) {
if (remainM == 0) {} else {
remainM = parseInt(remainM) - 1;
remainS = 59;
}
} else {
remainS = parseInt(remainS) - 1;
}
var remainSr = String(remainS);
var remainMr = String(remainM);
if (parseInt(remainS) <= 9) {
remainSr = "0" + String(remainS);
}
if (parseInt(remainM) <= 9) {
remainMr = "0" + String(remainM);
}
remain = String(remainMr) + ":" + String(remainSr);
document.getElementById("hello").innerHTML = remain;
}
</script>
You need to specify the radix in parseInt. If you do parseInt("09"), you are asking to parse the octal number 9, which is an error. See the parseInt documentation on MDC
parseInt("09") returns 0. if you change it to parseFloat or parseInt("09", 10) it will work.
Others have covered the immediate problem — that you're accidentally treating a number as octal rather than decimal — but the deeper problem is that you're storing numbers as strings. Constantly converting to and from strings is convoluted and error-prone. A better design would be to store the time as two numbers and have a function that converts those numbers into a string on demand. Here's a version that keeps the numbers and their string representation separate:
var remain = {
mins: 14,
secs: 14,
toString: function () {
var pad = function(num) { return (num < 10 ? "0" : "") + num; };
return pad(this.mins) + ":" + pad(this.secs);
}
};
setInterval (timer, 660);
function timer() {
if (remain.secs === 0) {
if (remain.mins > 0) {
remain.mins -= 1;
remain.secs = 59;
}
} else {
remain.secs -= 1;
}
document.document.getElementById("hello").innerHTML = remain;
}
The parseInt() method actually returns the FIRST integer it finds, therefore you are getting back 0 from '09' when you're expecting 9. Try using the parseFloat() method there, and you should be golden. It will return '9' which is what you're expecting. I hope this helps!!
<!DOCTYPE html>
<html>
<body>
<button onclick="Timer()">Try it</button>
<script>
function Timer() {
var sec=0;
var mm =0;
setInterval(function(){
if(sec<10){
if(mm>=10) {
document.getElementById('p1').innerHTML= mm + ":"+ "0"+sec;
}
else {
document.getElementById('p1').innerHTML= "0"+mm + ":"+ "0"+sec;
}
sec = sec+1;
}
else if(sec >=10 && sec <= 59) {
if(mm>=10) {
document.getElementById('p1').innerHTML= mm + ":"+ sec;
}
else {
document.getElementById('p1').innerHTML= "0"+mm + ":"+ sec;
}
sec = sec+1;
}
else if(sec==60) {
sec=0;
mm = mm+1;
if(mm>=10) {
document.getElementById('p1').innerHTML= mm + ":"+ "0"+sec;
}
else {
document.getElementById('p1').innerHTML= "0"+mm + ":"+ "0"+sec;
}
sec = sec+1;
}
},1000);
}
</script>
<p id="p1"></p>
</body>
</html>
加载中,请稍侯......
精彩评论