Обратный отсчет даты и времени Javascript

Мне пришлось создать таймер обратного отсчета в стиле аукциона. Я установил дату окончания в коде javascript, а затем мне пришлось выяснить, как рассчитать разницу. Мой код работает и ведет обратный отсчет, но я хочу посмотреть, есть ли эффективный способ сделать это. Я получил расчет дня из книги, но подумал, что нет необходимости создавать переменную часа, минуты, секунды и делить на нее.

var day = 1000 * 60 * 60 *24;

// Initialize and set variables.
var startDate = new Date();
startDate.toTimeString();
var endDate = new Date('4 Oct 2014 12:30:00 UTC');
endDate.toTimeString();
var startHour = startDate.getHours();
var startMin = startDate.getMinutes();
var startSec = startDate.getSeconds();
var endHour = endDate.getHours();
var endMin = endDate.getMinutes();
var endSec = endDate.getSeconds();


// Make sure the start date comes first:
if (startDate < endDate) {

    // Get the interval:
    var diffDay = endDate - startDate;

    if (diffDay <= day) {
        intervalD = '1 day ';
    } else {
        intervalD = Math.round(diffDay/day) + ' days ';
    }

    if (endMin >= startMin){ // Make sure its counting down
        var diffHour = Math.abs(endHour - startHour); 
    } else { //Since start hour is greater, we now have to count down from 60.
        var diffHour = ((endHour - startHour) + 60);
    }


    if (endMin >= startMin){
        var diffMin = Math.abs(endMin - startMin);
    } else {
        var diffMin = ((endMin - startMin) + 60);
    }

    if (endSec >= startSec){
        var diffSec = Math.abs(endSec - startSec);
    } else {
        var diffSec = ((endSec - startSec) + 60);
    }

javascript date time
person EsotericRider    schedule 24.09.2014    source источник
comment
Если вы хотите, чтобы кто-то проверил ваш код, вам следует обратиться на Code Review.   -  person    schedule 24.09.2014
comment
Круто спасибо за совет!   -  person EsotericRider    schedule 24.09.2014

Ответы (1)


arrow_upward
0
arrow_downward

Пожалуйста, но ниже код в вашем файле и примените желаемую дату. Он отлично работает для меня. Дайте мне знать, если возникнут какие-либо проблемы.

<body>
    <form name="count">
    <input type="text" size="69" name="count2">
    </form>
    <script type="text/javascript">

        //change the text below to reflect your own,
        var before = "Christmas!"
        var current = "Today is Christmas. Merry Christmas!"
        var montharray = new Array("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec")

        function countdown(yr, m, d) {
            theyear = yr; themonth = m; theday = d
            var today = new Date()
            var todayy = today.getYear()
            if (todayy < 1000)
                todayy += 1900
            var todaym = today.getMonth()
            var todayd = today.getDate()
            var todayh = today.getHours()
            var todaymin = today.getMinutes()
            var todaysec = today.getSeconds()
            var todaystring = montharray[todaym] + " " + todayd + ", " + todayy + " " + todayh + ":" + todaymin + ":" + todaysec
            futurestring = montharray[m - 1] + " " + d + ", " + yr
            dd = Date.parse(futurestring) - Date.parse(todaystring)
            dday = Math.floor(dd / (60 * 60 * 1000 * 24) * 1)
            dhour = Math.floor((dd % (60 * 60 * 1000 * 24)) / (60 * 60 * 1000) * 1)
            dmin = Math.floor(((dd % (60 * 60 * 1000 * 24)) % (60 * 60 * 1000)) / (60 * 1000) * 1)
            dsec = Math.floor((((dd % (60 * 60 * 1000 * 24)) % (60 * 60 * 1000)) % (60 * 1000)) / 1000 * 1)
            if (dday == 0 && dhour == 0 && dmin == 0 && dsec == 1) {
                document.forms.count.count2.value = current
                return
            }
            else
                document.forms.count.count2.value = "Only " + dday + " days, " + dhour + " hours, " + dmin + " minutes, and " + dsec + " seconds left until " + before
            setTimeout("countdown(theyear,themonth,theday)", 1000)
        }

        //enter the Future count down date using the format year/month/day
        countdown(2016, 9, 24)
    </script>
</body>
person Prashant Sarvaiya    schedule 24.09.2014