需要幫助添加「天」到這個jQuery的倒數計時器

Question

我目前有一個倒數計時器，顯示小時，分鐘，秒。但是現在我想給它添加「天」。你能告訴我你將如何做到這一點？

這是代碼。我遺漏了php分貝查詢，因爲它不重要。

function Timer(container, timeLeft) { 
 
    // get hour, minute and second element using jQuery selector 
 
    var hoursContainer = $(container).find('.hour'); 
 
    var minsContainer = $(container).find('.min'); 
 
    var secsContainer = $(container).find('.sec'); 
 
    
 
    // hold time left 
 
    var currentTimeLeft = timeLeft; 
 
    // 1 second = 1000 ms 
 
    var secondsForTimer = 1000; 
 
    // hold ID value return by setInterval() 
 
    var timerInterval; 
 
    
 
    // call setInteval() only when timeLeft is greater than 0 
 
    if (currentTimeLeft == 0) { 
 
\t return; 
 
    } else { 
 
\t //Call setInterval()function and store ID value to timerInterval. 
 
\t timerInterval = setInterval(countdown, secondsForTimer); 
 
    } 
 
    
 
    //function being passed to setInterval() 
 
    function countdown() { 
 
    currentTimeLeft = parseInt(currentTimeLeft - secondsForTimer);  
 
    if (currentTimeLeft == 0) { 
 
     //stop calling countdown function by calling clearInterval() 
 
     clearInterval(timerInterval); 
 
     return; 
 
    } else {  \t 
 
     //calculate hours left 
 
     var wholeSeconds = parseInt(currentTimeLeft/1000,10); 
 
     var wholeMinutes = parseInt(currentTimeLeft/60000,10); 
 
     var wholeHours = parseInt(wholeMinutes/60,10); 
 
     //calculate minutes left 
 
     var minutes = parseInt(wholeMinutes % 60,10); 
 
     //calculate seconds left 
 
     var seconds = parseInt(wholeSeconds % 60,10); 
 
     //prefix 0 to hour, min and second counter 
 
     $(hoursContainer).text((wholeHours < 10 ? "0" : "") + wholeHours + (wholeHours <=0 ? " hr" : " hrs")); 
 
     $(minsContainer).text((minutes < 10 ? "0" : "") + minutes + (minutes <=0 ? " min" : " mins")); 
 
     $(secsContainer).text((seconds < 10 ? "0" : "") + seconds + (seconds <=0 ? " sec" : " secs")); 
 
    } 
 
    } 
 
}

<?php 
 

 
// db query here to get the expiry time from the database 
 
foreach($results as $k => $row) { 
 

 
    $expiry_date \t \t = \t $row['expiry_date']; 
 

 
    $timeLeft = (strtotime($expiry_date) - time()) * 1000; 
 
    $counterName = "counter_$k"; 
 

 
    ?> 
 
    <div class="counter <?php echo $counterName; ?>"> \t 
 
    <span class="hour">00</span> 
 
    <span class="min">00</span> 
 
    <span class="sec">00</span> 
 
    </div> 
 

 
    <script> 
 

 
    // initiate new timer 
 
    var timer = new Timer($('.<?php echo $counterName; ?>'), <?php echo $timeLeft; ?>); 
 

 
    </script> 
 

 
<?php 
 
} 
 

 
?>

Answer 1

試試這個

function Timer(container, timeLeft) { 
    // get hour, minute and second element using jQuery selector 
    var daysContainer = $(container).find('.day'); 
    var hoursContainer = $(container).find('.hour'); 
    var minsContainer = $(container).find('.min'); 
    var secsContainer = $(container).find('.sec'); 

    // hold time left 
    var currentTimeLeft = timeLeft; 
    // 1 second = 1000 ms 
    var secondsForTimer = 1000; 
    // hold ID value return by setInterval() 
    var timerInterval; 

    // call setInteval() only when timeLeft is greater than 0 
    if (currentTimeLeft == 0) { 
     return; 
    } else { 
     //Call setInterval()function and store ID value to timerInterval. 
     timerInterval = setInterval(countdown, secondsForTimer); 
    } 

    //function being passed to setInterval() 
    function countdown() { 
    currentTimeLeft = parseInt(currentTimeLeft - secondsForTimer);  
    if (currentTimeLeft == 0) { 
     //stop calling countdown function by calling clearInterval() 
     clearInterval(timerInterval); 
     return; 
    } else {   
     //calculate hours left 
     var wholeSeconds = parseInt(currentTimeLeft/1000,10); 
     var wholeMinutes = parseInt(currentTimeLeft/60000,10); 
     var wholeHours = parseInt(wholeMinutes/60,10); 
     var wholeDays = parseInt(wholeHours/24,10); 
     //calculate hours left 
     var hours = parseInt(wholeHours % 24,10); 
     //calculate minutes left 
     var minutes = parseInt(wholeMinutes % 60,10); 
     //calculate seconds left 
     var seconds = parseInt(wholeSeconds % 60,10); 
     //prefix 0 to hour, min and second counter 
     $(daysContainer).text((wholeDays < 10 ? "0" : "") + wholeDays + (wholeDays <=0 ? " day" : " days")); 
     $(hoursContainer).text((hours < 10 ? "0" : "") + hours + (hours <=0 ? " hr" : " hrs")); 
     $(minsContainer).text((minutes < 10 ? "0" : "") + minutes + (minutes <=0 ? " min" : " mins")); 
     $(secsContainer).text((seconds < 10 ? "0" : "") + seconds + (seconds <=0 ? " sec" : " secs")); 
    } 
    } 
} 

加入天容器上你的循環

<div class="counter <?php echo $counterName; ?>"> 
    <span class="day">00</span> 
    <span class="hour">00</span> 
    <span class="min">00</span> 
    <span class="sec">00</span> 
</div> 

小提琴：https://jsfiddle.net/otezz/68d9yb6v/1/