Проблема с часами обратного отсчета на основе JavaScript

Question

Я пытаюсь сделать часы обратного отсчета JavaScript, которые начинаются с 1 часа до конца. Я использую только немного jQuery в процессе.

$(document).ready(function(){

var h,m,s,output;
$("#StartW").click(function(){
function startWork()
{
    h = 1;
    m = 0;
    s = 0;
    output = h + ":" + m + ":" + s;
    setInterval(function() {count()}, 1000);
}

function count()
{
    if(s == 0)
    {
        if(m == 0)
        {
            if(h == 0);
            {
                output = "time's up";
            }
            h = 0;
            m = 59;
            s = 59;
        }
    m = m - 1;
    s = 59;
    }
s = s - 1;
output = h + ":" + m + ":" + s;
document.getElementById("WTM").innerHTML = output;
}
});
});

1- StartW - это идентификатор кнопки, вызывающей функцию. 2- WMT - это идентификатор промежутка, на котором будут отображаться часы.

Когда я нажимаю кнопку, я не получаю результатов. Ничего не произошло. Консоль JavaScript в моем навигаторе не показывает никаких ошибок вообще.

Answer 1

На самом деле, при нажатии этой кнопки вы не вызываете никаких функций, вы просто запускаете их. Получить снаружи от события щелчка функции count а также startWorkи делать такие вещи, как

$('#StartW').on( 'click', startWork );

Проверьте это здесь

Answer 2

В вашей функции события click вы объявляете две функции, но никогда не вызываете их, поэтому ничего не происходит. Попробуй это:

$(document).ready(function(){

    var h,m,s,output;
    $("#StartW").click(function(){
        function startWork()
        {
            h = 1;
            m = 0;
            s = 0;
            output = h + ":" + m + ":" + s;
            setInterval(function() {count()}, 1000);
        }

        function count()
        {
            if(s == 0)
            {
                if(m == 0)
                {
                    if(h == 0)
                    {
                        output = "time's up";
                    }
                    h = 0;
                    m = 59;
                    s = 59;
                }
                m = m - 1;
                s = 59;
            }
            s = s - 1;
            output = h + ":" + m + ":" + s;
            document.getElementById("WTM").innerHTML = output;
        }
        startWork();
    });
});

Исправление отступов сделало это супер понятно, также есть ; на линии if(h == 0); это должно быть удалено

Как примечание для вашего способа подсчета одного часа, вы должны понимать, что он может быть не очень точным. Вы просите код ждать 1000 миллисекунд, чтобы добавить 1 секунду самостоятельно, точно так же, как мы подсчитываем секунды, говоря "миссисипи", чтобы помочь нам подождать следующую секунду. Хотя JavaScript более точен при подсчете 1000 миллисекунд за 1 секунду, так как мы должны сказать "миссисипи" ровно за одну секунду, он может быть отключен по причинам X и Y. Единственный реальный точный способ узнать, сколько времени прошло, - это смотреть на часы и смотреть на них снова и снова, пока они не покажут, что мы ждали час. Так, в JS сохраните время, когда оно началось, каждую секунду или около того отображайте оставшееся время по разнице текущего времени и времени запуска и отображайте таймер.