Hoortoestel voor hondentraining - setTimeout ()

• Mei 11, 2024

In een vorig artikel begon ik met de iteratieve ontwikkeling van een klein JavaScript-programma om een ​​hond te trainen om geluidssignalen te geven. Tot nu toe bevat het programma, dat u hier kunt bekijken, een ingestelde alarmknop die, wanneer ingedrukt, een waarschuwing laat zien dat het alarm is afgegaan (hoewel het hoorbare alarm nog niet is geconfigureerd.) Als de volgende stap gaan het wachten instellen tussen het indrukken van de knop "alarm instellen" en het alarm, zoals het is, afgaan.

JavaScript en het Document Object Model (DOM) hebben een aantal event-handlers die wachten tot er iets gebeurt (d.w.z. bij klikken, onMouseOver, ...); in dit geval willen we echter wachten op een bepaalde tijd, de DOM biedt ook een methode om dit te doen setTimeout (). setTimeout () vereist twee argumenten, een stuk code of een functie om uit te voeren en de tijd om in milliseconden te wachten voordat het wordt uitgevoerd. set_timeout () kan ook een optionele derde optie nemen die de gebruikte scripttaal aangeeft - JavaScript, JScript of VBScript (dit is onderdeel van de DOM, geen JavaScript, onthoud).

Onze nieuwe code ziet er als volgt uit:


functie do_alarm () {
// bepaal de tijd om in seconden te wachten
wait_secs = 52; // definieer het voor nu gewoon
// wacht tot de tijd om is en alarm afgaat
setTimeout (sound_alarm (), (wait_secs * 1000))
}


Dit werkt geweldig, maar het is moeilijk te zeggen, omdat er niets verandert nadat u op de knop hebt gedrukt totdat de tijd om is. De DOM kan ons hier echter ook bij helpen. Ik heb de volgende 2 regels toegevoegd aan het begin van de do_alarm () functie:


// alarm markeren als ingesteld
document.getElementById ( "alarm_button"). disabled = true
document.getElementById ("alarm_button"). value = "Alarm Set"


Dit verandert de knop die we hebben ingedrukt om het alarm in te stellen om "Alarmset" te zeggen en schakelt het uit. Als we het alarm opnieuw willen kunnen gebruiken, moeten we de knop terugzetten naar de oorspronkelijke staat. Ik heb dit toegevoegd aan de functie sound_alarm (). U kunt alle code bekijken en hier een werkend voorbeeld uitproberen.

Video-Instructies: Pizza Challenge | Whitney and Blakely (Mei 2024).