ヘルプが必要です：日付を使用してゼロで停止するカウントダウンタイマー

Question

誰かが私を助けることができるのだろうかと思います。ここやウェブで何時間も検索した後、私はJavascriptを使って簡単なカウントダウンを見つけることができないようです。私は、私が入力してゼロで停止する日付までカウントダウンするJavaScriptを使用してカウントダウンタイマーを作っています。私がここに持っているものは、日付を使用してカウントダウンしますが、ゼロで停止しません。あなたは残り時間が0未満の

if (t < 0) { 

しかしtあるかどうかを確認しようとしている

<div id="clockdiv"> 
    <div> 
     <span class="days"></span> 
     <div class="smalltext">Days</div> 
    </div> 
    <div> 
     <span class="hours"></span> 
     <div class="smalltext">Hours</div> 
    </div> 
    <div> 
     <span class="minutes"></span> 
     <div class="smalltext">Minutes</div> 
    </div> 
    <div> 
     <span class="seconds"></span> 
     <div class="smalltext">Seconds</div> 
    </div> 
</div> 
<script> 
var deadline = new Date(Date.parse(new Date("12/23/2016 11:47:00"))); 
initializeClock('clockdiv', deadline) 

function getTimeRemaining(endtime) { 
var t = Date.parse(endtime) - Date.parse(new Date()); 
var seconds = Math.floor((t/1000) % 60); 
var minutes = Math.floor((t/1000/60) % 60); 
var hours = Math.floor((t/(1000 * 60 * 60)) % 24); 
var days = Math.floor(t/(1000 * 60 * 60 * 24)); 

return { 
    'total': t, 
    'days': days, 
    'hours': hours, 
    'minutes': minutes, 
    'seconds': seconds 
}; 
} 

function initializeClock(id, endtime) { 
    var clock = document.getElementById(id); 
    var daysSpan = clock.querySelector('.days'); 
    var hoursSpan = clock.querySelector('.hours'); 
    var minutesSpan = clock.querySelector('.minutes'); 
    var secondsSpan = clock.querySelector('.seconds'); 



function updateClock() { 
    var t = getTimeRemaining(endtime); 

daysSpan.innerHTML = t.days; 
hoursSpan.innerHTML = ('0' + t.hours).slice(-2); 
minutesSpan.innerHTML = ('0' + t.minutes).slice(-2); 
secondsSpan.innerHTML = ('0' + t.seconds).slice(-2); 

    if (t < 0) { 
    clearInterval(timeinterval); 

    } 

} 

updateClock(); 
    var timeinterval = setInterval(updateClock, 1000); 

} 
</script> 

Answer 1

はオブジェクトです。あなたは、あなたの質問にエラーを修正しないでください

if (t.total <= 0) 

// Set the deadline to 5 seconds in the future 
 
var deadline = new Date(Date.now() + 5000); 
 
initializeClock('clockdiv', deadline) 
 

 
function getTimeRemaining(endtime) { 
 
    var t = Date.parse(endtime) - Date.parse(new Date()); 
 
    var seconds = Math.floor((t/1000) % 60); 
 
    var minutes = Math.floor((t/1000/60) % 60); 
 
    var hours = Math.floor((t/(1000 * 60 * 60)) % 24); 
 
    var days = Math.floor(t/(1000 * 60 * 60 * 24)); 
 

 
    // Make sure it never displays below 0 
 
    return { 
 
    'total': t, 
 
    'days': Math.max(0, days), 
 
    'hours': Math.max(0, hours), 
 
    'minutes': Math.max(0, minutes), 
 
    'seconds': Math.max(0, seconds) 
 
    }; 
 
} 
 

 
function initializeClock(id, endtime) { 
 
    var clock = document.getElementById(id); 
 
    var daysSpan = clock.querySelector('.days'); 
 
    var hoursSpan = clock.querySelector('.hours'); 
 
    var minutesSpan = clock.querySelector('.minutes'); 
 
    var secondsSpan = clock.querySelector('.seconds'); 
 

 
    function updateClock() { 
 
    var t = getTimeRemaining(endtime); 
 
    daysSpan.innerHTML = t.days; 
 
    hoursSpan.innerHTML = ('0' + t.hours).slice(-2); 
 
    minutesSpan.innerHTML = ('0' + t.minutes).slice(-2); 
 
    secondsSpan.innerHTML = ('0' + t.seconds).slice(-2); 
 

 
    if (t.total <= 0) { 
 
     clearInterval(timeinterval); 
 
    } 
 
    } 
 

 
    updateClock(); 
 
    var timeinterval = setInterval(updateClock, 1000); 
 
}

<div id="clockdiv"> 
 
    <div> 
 
    <span class="days"></span> 
 
    <div class="smalltext">Days</div> 
 
    </div> 
 
    <div> 
 
    <span class="hours"></span> 
 
    <div class="smalltext">Hours</div> 
 
    </div> 
 
    <div> 
 
    <span class="minutes"></span> 
 
    <div class="smalltext">Minutes</div> 
 
    </div> 
 
    <div> 
 
    <span class="seconds"></span> 
 
    <div class="smalltext">Seconds</div> 
 
    </div> 
 
</div>