NaN而不是数字- javascript
NaN instead of numbers - javascript
我正在制作一个显示当前时间的网页,以及一个硬编码时间的倒计时。目前的时间工作完美,但倒计时显示NaN而不是数字…没有控制台错误。这是我的代码:
<!DOCTYPE html>
<html>
<head>
<script>
function startTime() {
var now = new Date();
var deadline = new Date();
var countdown = new Date("12:10:00");
// deadline setten moet via gui kunnen____________________________
// deadline.setHours(11);
// deadline.setMinutes(10);
// deadline.setSeconds(0);
//________________________________________________________________
var clockH = now.getHours();
var clockM = now.getMinutes();
var clockS = now.getSeconds();
// var countdownH = getCountdown(deadline).hours;
// var countdownM = getCountdown(deadline).minutes;
// var countdownS = getCountdown(deadline).seconds;
//m = checkTime(m);
//s = checkTime(s);
startClock('clock');
startCountdown('countdown', deadline);
var t = setTimeout(startTime, 500);
}
function getCountdown(deadline){
var countdownTotal = Date.parse(deadline) - Date.parse(new Date());
var countdownS = Math.floor( (countdown/1000) % 60 );
var countdownM = Math.floor( (countdown/1000/60) % 60 );
var countdownH = Math.floor( (countdown/(1000*60*60)) % 24 );
return{
'countdownTotal': countdownTotal,
'countdownH': countdownH,
'countdownM': countdownM,
'countdownS': countdownS
}
}
function startClock(id){
var clock = document.getElementById(id);
var timeInterval = setInterval(function(){
var now = new Date();
var nowH = now.getHours();
var nowM = now.getMinutes();
var nowS = now.getSeconds();
clock.innerHTML = 'hours: '+ nowH + ' minutes: ' + nowM + ' seconds: ' + nowS;
}, 1000);
}
function startCountdown(id, deadline){
var countdown = document.getElementById(id);
var timeInterval = setInterval(function(){
var t = getCountdown(deadline);
countdown.innerHTML = 'hours: '+ t.countdownH + ' minutes: ' + t.countdownM + ' seconds: ' + t.countdownS;
if(t.countdownTotal <= 0){
clearInterval(timeInterval);
}
}, 1000);
}
function checkTime(i) {
if (i < 10) {i = "0" + i}; // add zero in front of numbers < 10
return i;
}
</script>
</head>
<body onload="startTime()">
<div id="clock"> </div><br>
<div id="countdown"> </div>
</body>
</html>
你的实际问题是,你的倒计时变量无效:
var countdown = new Date("12:10:00")
//Invalid Date
countdown / 10
//NaN
三个问题:
-
var countdown = new Date("12:10:00");
日期格式无效。 -
countdown
应该代替startCountdown参数中的deadline
。 在 -
countdownTotal
代替countdown
。
getCountdown
方法中,应使用<!DOCTYPE html>
<html>
<head>
<script>
function startTime() {
var now = new Date();
var deadline = new Date();
// year, month, day, hours, minutes, seconds, milliseconds
var countdown = new Date(2016, 11, 3, 18, 00);
//console.log(countdown);
// deadline setten moet via gui kunnen____________________________
// deadline.setHours(11);
// deadline.setMinutes(10);
// deadline.setSeconds(0);
//________________________________________________________________
var clockH = now.getHours();
var clockM = now.getMinutes();
var clockS = now.getSeconds();
// var countdownH = getCountdown(deadline).hours;
// var countdownM = getCountdown(deadline).minutes;
// var countdownS = getCountdown(deadline).seconds;
//m = checkTime(m);
//s = checkTime(s);
startClock('clock');
startCountdown('countdown', countdown);
var t = setTimeout(startTime, 500);
}
function getCountdown(deadline){
//console.log(Date.parse(deadline));
//console.log(Date.parse(new Date()));
var countdownTotal = Date.parse(deadline) - Date.parse(new Date());
var countdownS = Math.floor( (countdownTotal/1000) % 60 );
var countdownM = Math.floor( (countdownTotal/1000/60) % 60 );
var countdownH = Math.floor( (countdownTotal/(1000*60*60)) % 24 );
return{
'countdownTotal': countdownTotal,
'countdownH': countdownH,
'countdownM': countdownM,
'countdownS': countdownS
}
}
function startClock(id){
var clock = document.getElementById(id);
var timeInterval = setInterval(function(){
var now = new Date();
var nowH = now.getHours();
var nowM = now.getMinutes();
var nowS = now.getSeconds();
clock.innerHTML = 'hours: '+ nowH + ' minutes: ' + nowM + ' seconds: ' + nowS;
}, 1000);
}
function startCountdown(id, deadline){
var countdown = document.getElementById(id);
var timeInterval = setInterval(function(){
var t = getCountdown(deadline);
//console.log(t);
countdown.innerHTML = 'hours: '+ t.countdownH + ' minutes: ' + t.countdownM + ' seconds: ' + t.countdownS;
if(t.countdownTotal <= 0){
clearInterval(timeInterval);
}
}, 1000);
}
function checkTime(i) {
if (i < 10) {i = "0" + i}; // add zero in front of numbers < 10
return i;
}
</script>
</head>
<body onload="startTime()">
<div id="clock"> </div><br>
<div id="countdown"> </div>
</body>
</html>
您应该使用注释掉的部分为您的startTime
function startTime() {
var now = new Date();
var deadline = new Date();
//var countdown = new Date("12:10:00");
// deadline setten moet via gui kunnen____________________________
deadline.setHours(19);
deadline.setMinutes(10);
deadline.setSeconds(0);
//________________________________________________________________
//var clockH = now.getHours();
//var clockM = now.getMinutes();
//var clockS = now.getSeconds();
// var countdownH = getCountdown(deadline).hours;
// var countdownM = getCountdown(deadline).minutes;
// var countdownS = getCountdown(deadline).seconds;
//m = checkTime(m);
//s = checkTime(s);
startClock('clock');
startCountdown('countdown', deadline);
var t = setTimeout(startTime, 500);
}
在getCountdown
方法中,你应该使用正确的变量名
function getCountdown(deadline){
var countdownTotal = Date.parse(deadline) - Date.parse(new Date());
var countdownS = Math.floor( (countdownTotal/1000) % 60 );
var countdownM = Math.floor( (countdownTotal/1000/60) % 60 );
var countdownH = Math.floor( (countdownTotal/(1000*60*60)) % 24 );
return{
'countdownTotal': countdownTotal,
'countdownH': countdownH,
'countdownM': countdownM,
'countdownS': countdownS
}
}
<!DOCTYPE html>
<html>
<head>
<script>
function startTime() {
var now = new Date();
var deadline = new Date();
//var countdown = new Date("12:10:00");
// deadline setten moet via gui kunnen____________________________
deadline.setHours(19);
deadline.setMinutes(10);
deadline.setSeconds(0);
//________________________________________________________________
//var clockH = now.getHours();
//var clockM = now.getMinutes();
//var clockS = now.getSeconds();
// var countdownH = getCountdown(deadline).hours;
// var countdownM = getCountdown(deadline).minutes;
// var countdownS = getCountdown(deadline).seconds;
//m = checkTime(m);
//s = checkTime(s);
startClock('clock');
startCountdown('countdown', deadline);
var t = setTimeout(startTime, 500);
}
function getCountdown(deadline){
var countdownTotal = Date.parse(deadline) - Date.parse(new Date());
var countdownS = Math.floor( (countdownTotal/1000) % 60 );
var countdownM = Math.floor( (countdownTotal/1000/60) % 60 );
var countdownH = Math.floor( (countdownTotal/(1000*60*60)) % 24 );
return{
'countdownTotal': countdownTotal,
'countdownH': countdownH,
'countdownM': countdownM,
'countdownS': countdownS
}
}
function startClock(id){
var clock = document.getElementById(id);
var timeInterval = setInterval(function(){
var now = new Date();
var nowH = now.getHours();
var nowM = now.getMinutes();
var nowS = now.getSeconds();
clock.innerHTML = 'hours: '+ nowH + ' minutes: ' + nowM + ' seconds: ' + nowS;
}, 1000);
}
function startCountdown(id, deadline){
var countdown = document.getElementById(id);
var timeInterval = setInterval(function(){
var t = getCountdown(deadline);
countdown.innerHTML = 'hours: '+ t.countdownH + ' minutes: ' + t.countdownM + ' seconds: ' + t.countdownS;
if(t.countdownTotal <= 0){
clearInterval(timeInterval);
}
}, 1000);
}
function checkTime(i) {
if (i < 10) {i = "0" + i}; // add zero in front of numbers < 10
return i;
}
</script>
</head>
<body onload="startTime()">
<div id="clock"> </div><br>
<div id="countdown"> </div>
</body>
</html>
我认为这将是你需要的。
<!DOCTYPE html>
<html>
<head>
<script>
function startTime() {
var now = new Date();
var deadline = new Date();
var countdown = new Date("November 03, 2016 20:00:00");
// deadline setten moet via gui kunnen____________________________
// deadline.setHours(11);
// deadline.setMinutes(10);
// deadline.setSeconds(0);
//________________________________________________________________
var clockH = now.getHours();
var clockM = now.getMinutes();
var clockS = now.getSeconds();
// var countdownH = getCountdown(deadline).hours;
// var countdownM = getCountdown(deadline).minutes;
// var countdownS = getCountdown(deadline).seconds;
//m = checkTime(m);
//s = checkTime(s);
startClock('clock');
startCountdown('countdown', countdown);
var t = setTimeout(startTime, 500);
}
function getCountdown(deadline){
var countdownTotal = Date.parse(deadline) - Date.parse(new Date());
var countdownS = Math.floor( (countdownTotal/1000) % 60 );
var countdownM = Math.floor( (countdownTotal/1000/60) % 60 );
var countdownH = Math.floor( (countdownTotal/(1000*60*60)) % 24 );
return{
'countdownTotal': countdownTotal,
'countdownH': countdownH,
'countdownM': countdownM,
'countdownS': countdownS
}
}
function startClock(id){
var clock = document.getElementById(id);
var timeInterval = setInterval(function(){
var now = new Date();
var nowH = now.getHours();
var nowM = now.getMinutes();
var nowS = now.getSeconds();
clock.innerHTML = 'hours: '+ nowH + ' minutes: ' + nowM + ' seconds: ' + nowS;
}, 1000);
}
function startCountdown(id, deadline){
var countdown = document.getElementById(id);
var timeInterval = setInterval(function(){
var t = getCountdown(deadline);
countdown.innerHTML = 'hours: '+ t.countdownH + ' minutes: ' + t.countdownM + ' seconds: ' + t.countdownS;
if(t.countdownTotal <= 0){
clearInterval(timeInterval);
}
}, 1000);
}
function checkTime(i) {
if (i < 10) {i = "0" + i}; // add zero in front of numbers < 10
return i;
}
</script>
</head>
<body onload="startTime()">
<div id="clock"> </div><br>
<div id="countdown"> </div>
</body>
</html>
相关文章:
- RegEx JavaScript:数字后的符号提取
- HTML文本框中的javascript数字
- Javascript数字选择器函数
- 我无法让我的javascript数字分类器工作
- 以零结尾的Javascript数字
- Javascript数字放置和如何,4 = 0.04,14 = 0.14,100 = 1.00
- JavaScript 数字近似
- Javascript数字验证功能起作用+需要建设性的批评
- 在小数点后给出一个固定宽度的 JavaScript 数字,同时保留一个数字
- Javascript 数字表示
- Javascript数字变量比较不起作用
- JavaScript 数字继承
- 如何将包含科学记数法的字符串转换为正确的 Javascript 数字格式
- JavaScript:数字计数器实时更新
- Javascript数字到单词 - vigesimal
- Javascript数字到单词 - vigesimal 200-999
- 将 JavaScript 数字转换为小数点后两位
- 带有输入模式的 Javascript 数字和逗号
- 我如何让这个 JavaScript 数字猜谜游戏在没有“while”或“for”循环的情况下工作
- Javascript数字辅助