Чередующийся Обратный отсчет - HTML - JavaScript

Question

Очевидно, что этот вопрос состоит из нескольких частей: одна для получения обратного отсчета и другая для чередования для отображения. Я хочу обратный отсчет до выходных (суббота 00:00), а в выходные дни будет отображаться обратный отсчет до конца выходных (понедельник 00:00)

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

Во-вторых, чередование: у меня нет много идей для этого, но я должен что-то придумать, или это не по теме. Так что, если я хочу, чтобы это изменилось дважды. Я мог бы сделать обратный отсчет переменной (x), а затем вы проверили бы, если x равен 0, затем добавьте единицу к y, а когда это нечетное число, отобразите 5-дневный обратный отсчет (432000 секунд), затем, когда это четное число, затем отобразите 2-дневный обратный отсчет (172800 секунд). Вот моя (вероятно, неудачная) попытка:

    if x=0 {
        if y=1 {
           var z=432000
        }
        else {
           var z=172000
        }
    }

Я не знаю, правильно ли это, но я надеюсь, что вы оцените мою попытку. Заранее спасибо!

Answer 1

Так что, если вы пытаетесь написать небольшое веб-приложение, которое делает то, что вы просите, то на самом деле вам не нужно использовать сторонний таймер. То, что вы действительно хотите, это Date объект. Затем вы можете использовать это, чтобы определить текущее время и день недели, и использовать это, чтобы выяснить, а) какой таймер вы хотите, и б) как долго, пока таймер не заканчивается.

var now = new Date;
var day = now.getDay(); // this returns a number from 0-6, where 0 is Sunday, going through the days of the week.
var month = now.getMonth();
var date = now.getDate();
var year = now.getFullYear();
var target_time; // this will be used to store the time at which the timer elapses
var day_offset; // this stores the number of days we need to offset by until we get to the end of the timer
if(day === 0 || day === 6){
    // it's the weekend!
    day_offset = (day === 0) ? 1 : 2;
    target_time = new Date(year, month, date+day_offset, 0, 0, 0);
} else {
    // it's a week day!
    day_offset = 6-day; // i think this will work!
    target_time = new Date(year, month, date+day_offset, 0, 0, 0);
}
var milliseconds_until_end = target_time.getTime() - Date.now();
// milliseconds_until_end is the number of milliseconds until the timer should end. 
// you can parse this in all sorts of ways, but for starters, you could do something 
// like this:
var seconds = Math.floor(milliseconds_until_end/1000);
var minutes = seconds/60;
var hours = minutes/60;
var extra_minutes = 60 * (hours - Math.floor(hours));
var extra_seconds = 60 * (extra_minutes - Math.floor(extra_minutes));
hours = Math.floor(hours);
extra_minutes = Math.floor(extra_minutes);
extra_seconds = Math.floor(extra_seconds);
// presumably we want to write all this somewhere!
var output = document.getElementById("output");
output.textContent = hours + ":" + extra_minutes + ":" + extra_seconds;

Просто предупреждение, я не проверял ничего из этого. Все, что вам нужно сделать сейчас, это поместить весь этот код в setInterval. Чтобы сделать это, вы должны сначала обернуть весь приведенный выше код в определение функции (которую мы можем назвать getTime функция).

setInterval(getTime, 1); // this makes the getTime function trigger once every millisecond (not second as i had previously! my bad).