Добавление кнопки «отложить» к будильнику с помощью clearInterval (). Что я делаю неправильно? - PullRequest
Новая
       44

Добавление кнопки «отложить» к будильнику с помощью clearInterval (). Что я делаю неправильно?

0 голосов
/ 11 апреля 2020

Я работаю над проектом приложения "Будильник" на практике JavaScript. Я довольно новичок в этом, так что, возможно, я просто не правильно понимаю clearInterval (), и я надеялся, что кто-то может помочь.

JavaScript: 

let sound = new Audio('./music/alarmsound.mp3');
let playAudio = () => sound.play();
const snooze = document.getElementById('snooze');
let pause = () => sound.pause();

let alarm = document.getElementById('alarm');
alarm.onclick = function setAlarm() {
    let userHour = prompt("Please enter the hour of which you would like the alarm to be set ?", "07");
    if (userHour.charAt(0) > 0 && userHour < 10) {
        userHour = "0" + userHour;
    }
    let userMinutes = prompt("Please enter the minutes of which you would like the alarm to be set ?", "30");
    let timeformat = [userHour, userMinutes];
    function realTime() {
        let realtime = new Date();
        if(timeformat[0] == realtime.getHours() && timeformat[1] == realtime.getMinutes()) {
            playAudio();
        } 
        if(timeformat[0] != realtime.getHours && timeformat[1] != realtime.getMinutes()) {
            pause();
        }
    }
    let checkTime = () => {
        setInterval(realTime, 1000)
    }


checkTime();
let stopAlarm = () => {
    clearInterval(checkTime);
}
snooze.addEventListener("click", stopAlarm());
}

Когда пользователь нажимает кнопку будильника, появляется запрос на то, чтобы он установил часы, а затем минуты, которые он хочет, чтобы будильник включил go выкл. Эта часть работает. Кроме того, по прошествии одной минуты, когда текущее время больше не соответствует времени будильника, установленному пользователем, звук прекращается. Тем не менее, я пытаюсь добавить функциональность кнопки повтора, и я не могу заставить ее работать, независимо от того, что я пытаюсь.

Любые советы и рекомендации приветствуются! Извините, если код грязный, как я уже сказал, я только начал с JS.

1 Ответ

0 голосов
/ 11 апреля 2020

Несколько вещей заставляют это работать не так, как вы ожидаете. Проверьте предложенные изменения, я добавил комментарии. 

const snooze = document.getElementById('snooze');
const alarm = document.getElementById('alarm');
const sound = new Audio('./music/alarmsound.mp3');
const playAudio = () => sound.play();
const pause = () => sound.pause();
let intval; // 1. keep a reference to the interval outside of setAlarm()

alarm.onclick = function setAlarm() {
    let userHour = prompt("Please enter the...", "07");
    if (userHour.charAt(0) > 0 && userHour < 10) {
        userHour = "0" + userHour;
    }
    let userMinutes = prompt("Please enter the...", "30");
    let timeformat = [userHour, userMinutes];
    function realTime() {
        let realtime = new Date();
        if(timeformat[0] == realtime.getHours() && timeformat[1] == realtime.getMinutes()) {
            playAudio();
        } 
        if(timeformat[0] != realtime.getHours && timeformat[1] != realtime.getMinutes()) {
            pause();
        }
    }

    intval = setInterval(realTime, 1000) // 2. assign interval to the variable
}

// 3. Dont set your event listener inside the setAlarm() function (unless it's required)
function stopAlarm() {
   clearInterval(intval); // 4. Clear interval with correct reference
}
snooze.addEventListener("click", stopAlarm);
...