Измените количество секунд до минут и часов - PullRequest
Новая
       47

Измените количество секунд до минут и часов

0 голосов
/ 02 марта 2019

В моем проекте настроена система обратного отсчета, в которой пользователь по часам вводит срок, на который он хочет зарезервировать что-то.т.е. 1,2,3,4 часа и т. д. Затем запускается таймер обратного отсчета и уведомляет их, когда это будет сделано.Я нашел действительно хороший онлайн, однако он дает обратный отсчет только в отношении оставшихся секунд.Мне интересно, знает ли кто-нибудь, как манипулировать этим кодом, чтобы показывать часы: оставшиеся минуты.

Я уже пробовал w3schools, однако это не сработает, поскольку это соответствует фактическому данному будущему времени 

        <!-- $_row["Time"] returns the number of hours hence must multiply by 3600 to get it in terms of seconds for this example to work -->
    <?php $remain= $_row["Time"] * 3600;  ?>



<script>
function countDown(secs,elem) {
    var element = document.getElementById(elem);
    element.innerHTML = "Time Remaining "+secs+" seconds";
    if(secs < 1) {
        clearTimeout(timer);
        element.innerHTML = '<h2>Your Time is up!</h2>';
        element.innerHTML += '<p>Please evacuate the parking space as soon as possible</p><br>';
        element.innerHTML += '<a href="Home.php">Return to Home</a>';
    }
    secs--;
    var timer = setTimeout('countDown('+secs+',"'+elem+'")',1000);
}
</script>
<div id="status"></div>
<script>countDown(<?php echo $remain ?>,"status");</script>

Ответы [ 2 ]

0 голосов
/ 02 марта 2019

Продолжая мой комментарий ...

"Я нашел действительно хороший онлайн" - нет, ты не сделал.На самом деле вы, вероятно, нашли худшее из всех возможных.Передача строки в setTimeout?Полагаясь на setTimeout, чтобы быть точным?(подсказка: это не так и никогда не указывалось).Кроме того, условие «конца» даже не выполняется правильно, потому что оно пытается очистить тайм-аут до того, как оно будет установлено ...

Попробуйте вместо этого что-то подобное. 

function countDown(secs,elem) {
    var element = document.getElementById(elem);
    var targetTime = Date.now() + secs*1000;
    var timer;

    function formatTime(secs) {
        var hours = Math.floor(secs/3600);
        var minutes = Math.floor(secs/60)%60;
        var seconds = secs%60;
        var pad = function(n) {return n<10 ? "0"+n : n;};
        return hours+":"+pad(minutes)+":"+pad(seconds);
    }
    function tick() {
        var timeleft = Math.floor((targetTime - Date.now()) / 1000);
        element.innerHTML = "Time Remaining: "+formatTime(timeleft);
        if( timeleft < 0) {
            element.innerHTML = "Time up!";
            clearInterval(timer);
        }
   }

   timer = setInterval(tick, 200); // higher numbers are less precise
   tick(); // perform first update immediately
}

При этом используется фактическое время, чтобы обеспечить время окончания, когда оно должно быть!

0 голосов
/ 02 марта 2019

используйте такой код 

<script>
function secondsToHms(d) {
    d = Number(d);
    var h = Math.floor(d / 3600);
    var m = Math.floor(d % 3600 / 60);
    var s = Math.floor(d % 3600 % 60);

    var hDisplay = h > 0 ? h + (h == 1 ? " hour, " : " hours, ") : "";
    var mDisplay = m > 0 ? m + (m == 1 ? " minute, " : " minutes, ") : "";
    var sDisplay = s > 0 ? s + (s == 1 ? " second" : " seconds") : "";
    return hDisplay + mDisplay + sDisplay; 
 }

function countDown(secs,elem) {
    var element = document.getElementById(elem);
    var h=secondsToHms(secs);
    element.innerHTML = "Time Remaining "+h;
    if(secs < 1) {
        clearTimeout(timer);
        element.innerHTML = '<h2>Your Time is up!</h2>';
        element.innerHTML += '<p>Please evacuate the parking space as soon as 
       possible</p><br>';
        element.innerHTML += '<a href="Home.php">Return to Home</a>';
    }
    secs--;
    var timer = setTimeout('countDown('+secs+',"'+elem+'")',1000);
}
</script>

<div id="status"></div>
<script>countDown(10,"status");</script>
...