Bar: /* Eksempel med setTimeout() og clearTimeout() */

2022-10-31T13:42:29Z

Eksempel med setTimeout() og clearTimeout()

← Ældre version		Versionen fra 31. okt. 2022, 15:42
Linje 82:		Linje 82:

	Hele koden kan findes i setTimeout2.html i denne [[Media:setTimout.zip\|ZIP-fil]]		Hele koden kan findes i setTimeout2.html i denne [[Media:setTimout.zip\|ZIP-fil]]
			{{webcode}}
	[[Kategori:Tid_i_javaScript]]		[[Kategori:Tid_i_javaScript]]

Bar: 1 version importeret

2022-10-22T12:13:13Z

1 version importeret

← Ældre version	Versionen fra 22. okt. 2022, 14:13
(Ingen forskel)

htx_>Bar: /* Eksempel med setTimeout() og clearTimeout() */

2011-09-07T10:49:03Z

Eksempel med setTimeout() og clearTimeout()

Ny side

==Formålet med setTimeout==
Det man kan med setTimeout er at man kan lægge en besked om at der skal foregå noget i programmet efter en vis tid.

Dette kan bruges til mange forskellige ting, men typisk til noget der gør et program på en hjemmeside mere dynamisk - hvis man bruger det udstrakt kan man faktisk skabe bevægelser i i siden - til dette formål er [[setInterval]] dog mere anvendelig.

==Hvordan fungerer setTimeout==

setTimeout kan kaldes hvor som helst fra i koden, og skal have 2 parametre:

# En tekst-streg med navnet på den funktion der skal kaldes (eller basalt set den kode der skal afvikles).
# En tid angivet i millisekunder, så hvis funktionen skal kaldes efter 2 sekunder, så skal der stå 2000

===Kald til setTimeout===

setTimeout kaldes som følger:

setTimeout("minFunktion();", 2000);

Man skal så selvfølgelig have defineret funktionen minFunktion() som f.x.

function minFunktion() {
document.getElementById("besked").innerHTML = "Der er gået 2 sekunder";
}
==Eksempel på setTimeout==

Eksemplet her anvender setTimeout til at gøre brugeren opmærksom på at der skal indtastes noget på siden.

Opsætningen af setTimeout gøres præcist som illustreret:

setTimeout("advarsel();", 5000);

Funktionen advarsel er så defineret som følger:

<pre>
function advarsel () {
if (advaret) return; // Hvis man ikke skal advares, så returneres uden at man gør noget
alert("Du skal indtaste noget på siden");
document.getElementById("testFelt").focus();
}
</pre>

Variablen "advaret" bliver håndteret af en funktion der angiver at man er blevet advaret, hvis man taster noget i feltet.

Hele koden kan findes i setTimeout.html i denne [[Media:setTimout.zip|ZIP-fil]]

==clearTimeout==

Når man kan sætte en event op til at ske efter et stykke tid, så kan det nogle gange være smart, at man kan stoppe eventen inden den er sket. Dette kan gøres med clearTimeout().

Det kræver blot at man har styr på sin event, og det gør man ved at oprette en variabel med en henvisning til event-handleren, f.x. som følgende:

var minTimer = setTimeout("minFunktion();", 2000);

==Eksempel med setTimeout() og clearTimeout()==

Problematikken er den samme som i det foregående eksempel, men det løses bare på en anden måde.

Som vist oven over husker vi timeren ved at placere den i en variabel - her "huskTimer1".

var huskTimer1 = setTimeout("advarsel();", 5000);

Som før har vi en funktionder håndterer advarslen, men den tjekker ikke på om man er blevet advaret - det er ikke nødvendigt med denne programkonstruktion

<pre>
function advarsel () {
alert("Du skal indtaste noget på siden");
document.getElementById("testFelt").focus();
}
</pre>

Det der håndterer at advarsel() funktionen ikke kaldes er en funktion keyTest(), som sletter eventen ved hjælp af clearTimeout() som vist her:

<pre>
function keyTest () {
clearTimeout(huskTimer1); // Indiker at der ikke skal advares, hvis man har tastet noget
}
</pre>

Funktionen aktiveres så fra det inputfelt vi gerne vil gøre opmærksom på, ved at sætte en eventhandler på onKeyPress til at kalde funktionen keyTest():

<input type="text" id="testFelt" onKeyPress="keyTest();" />

Hele koden kan findes i setTimeout2.html i denne [[Media:setTimout.zip|ZIP-fil]]

[[Kategori:Tid_i_javaScript]]

SetTimeout - Versionshistorie

Bar: /* Eksempel med setTimeout() og clearTimeout() */

Bar: 1 version importeret

htx_>Bar: /* Eksempel med setTimeout() og clearTimeout() */