/ Forside / Teknologi / Udvikling / Java Scripts / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
Java Scripts
#NavnPoint
molokyle 5410
Klaudi 2799
smorch 2439
kim 1360
Harlekin 1134
bentjuul 984
gibson 800
severino 695
Random 675
10  konsulent.. 626
Hvordan venter man i Javascript ?
Fra : scootergrisen


Dato : 01-08-11 09:31

Jeg har læst om at man kan vente i javascript sådan her :

window.setTimeout(afterDelay, 5000);

function afterDelay() {
alert("5 seconds have passed");
}

Men behøver man virkelig skulle kalde en funktion bare fordi man vil
vente ?

Lad os sige jeg vil tegne nogle billederne oven på hinanden med
javascript sådan at det bliver en animation.

Så vil jeg gerne kunne skrive noget i stil med :

tegnbilled(1);
vent(1000); // 1 sekund
tegnbilled(2);
vent(1000); // 1 sekund
tegnbilled(3);
vent(1000); // 1 sekund
tegnbilled(4);
vent(1000); // 1 sekund

Hvis man nu skal bruge setTimeout(); kan man så ikke gøre det uden at
kalde en funktion ?
setTimeout(false, 1000); eller sådan noget ?
Sådan at den bare stå der og venter 1 sekunder også forsætter.

 
 
Birger Sørensen (01-08-2011)
Kommentar
Fra : Birger Sørensen


Dato : 01-08-11 17:34

scootergrisen forklarede:
> Jeg har læst om at man kan vente i javascript sådan her :
>
> window.setTimeout(afterDelay, 5000);
>
> function afterDelay() {
> alert("5 seconds have passed");
> }
>
> Men behøver man virkelig skulle kalde en funktion bare fordi man vil
> vente ?
>
> Lad os sige jeg vil tegne nogle billederne oven på hinanden med
> javascript sådan at det bliver en animation.
>
> Så vil jeg gerne kunne skrive noget i stil med :
>
> tegnbilled(1);
> vent(1000); // 1 sekund
> tegnbilled(2);
> vent(1000); // 1 sekund
> tegnbilled(3);
> vent(1000); // 1 sekund
> tegnbilled(4);
> vent(1000); // 1 sekund
>
> Hvis man nu skal bruge setTimeout(); kan man så ikke gøre det uden at
> kalde en funktion ?
> setTimeout(false, 1000); eller sådan noget ?
> Sådan at den bare stå der og venter 1 sekunder også forsætter.

Nej.

setTimeout() - og set Interval() - kalder en funktion efter det angivne
interval.
Der findes ingen Delay funktion i js.

<script..>
var billed_nr = 0; // eller nr for det første af dine billeder
var max_billed_nr = 23; // nummer+1 for sidste billede
setTimeOut( TegnBilled, 1000);

function TegnBilled() {
// tegn bileddet med billed_nr
billednr += 1;
if ( billed_nr < max_billed_nr) {
setTimeOut( TegnBilled, 1000);
}
}
</script>

Hvis billederne ikke er i numerisk rækkefølge, eller der mangler nummre
ind imellem, brug et array, og billed_nr skal så være index i arrayet -
så er max_billednr overflødigt, idet man så kan bruge
billed_array.length. Og det vill være enklere at vedligeholde (indsætte
fjerne billeder).
Det helt korrekte er at sætte Timeout i en <img>'s onload. Så regnes
den tid det tager brugerens browser at hente/vise billedet ikke med i
venteperioden. onload validerer ikke - men kan sagtens bruges og
tildeles unobtrusive.

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Lasse Reichstein Nie~ (13-08-2011)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 13-08-11 11:51

=?ISO-8859-15?Q?Birger_S=F8rensen?= <sdc@bbsorensen.com> writes:

> Rent prinipielt er type"text/javascript" deprecated i HTML 4.01. Det
> hedder type="text/ecmascript". Og det bør det så hedde i HTML5.

Faktisk er "text/javascript" det HTML 4.01 anbefaler:
http://www.w3.org/TR/1999/REC-html401-19991224/interact/scripts.html#h-18.2.2.2
I HTML 5 kan man bare udelade type-attributten, defaulten er at det er
Javascript.

> Det kan ofte svare sig at bruge terney operator i stedet for if, hvor
> man altid vil have returneret en vrædi, som skal tildeles samme
> variabel...

Bare for at være pedant (en arbejdsskade), så er operatorens navn
"(the) conditional operator". Den er en "ternary operator" ("ternær
operator" på dansk) ved det at den tager tre operander, lige som * er
en "binary/binær" operator. Den er så den eneste ternære operator, så
man kan tale om "the ternary operator", men det er ikke det den faktisk
hedder.

> Du har
> index1++;
> if(index1==allebilleder1.length){
> index1=0;
> }
> det (kan) skrives som
> index1 = (index1 < allebilleder1.length-1) ? index1+1 : 0;
> (
> Det er det samme som
> if (index1 < allebilleder1.length-1) { index1 = index1+1; } //index++
> else { index1 = 0; }
> )

Personligt synes jeg det første er letter at læse.
Betingelses-operatoren er gør sjældent ting nemmere at overskue, da den
mangler de læselige nøgleord som "if" og "else". De små "?"- og ":"-tegn
forsvinder nemt i mylderet hvis man har bare lidt komplekse udtryk mellem
dem.

/L
--
Lasse Reichstein Holst Nielsen
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

Birger Sørensen (13-08-2011)
Kommentar
Fra : Birger Sørensen


Dato : 13-08-11 13:22

Lasse Reichstein Nielsen formulerede lørdag:
> =?ISO-8859-15?Q?Birger_S=F8rensen?= <sdc@bbsorensen.com> writes:
>
>> Rent prinipielt er type"text/javascript" deprecated i HTML 4.01. Det
>> hedder type="text/ecmascript". Og det bør det så hedde i HTML5.
>
> Faktisk er "text/javascript" det HTML 4.01 anbefaler:
> http://www.w3.org/TR/1999/REC-html401-19991224/interact/scripts.html#h-18.2.2.2
> I HTML 5 kan man bare udelade type-attributten, defaulten er at det er
> Javascript.

Det har jeg da vist fået galt i halsen...
Der står nu ikke noget om at den er den foretrukne, men at der skal
angives een - der er ingen default i HTML4.01 (tror nu at browserne
bruger en default, alligevel). At den angives i eksemplerne, skal man
nok tage med let hånd. W3C's dokumentation for XHTML henviser f.eks.
til HTML4.01 eksempler - der alle bruger store bogstver i tags. Og det
må man som bekendt ikke i XHTML. Så standarder er een ting, eksempler
noget helt andet, npr det handler om W3C...
IANA har obsoleted både text/javascript og text/ecmascript, og vil have
os til at bruge application/...script i stedet. Det tror jeg så ikke
browserne er helt enige i - specielt ikke IE.
Men tak da, for at hive mig ud af den vildfarelse...


>> Det kan ofte svare sig at bruge terney operator i stedet for if, hvor
>> man altid vil have returneret en vrædi, som skal tildeles samme
>> variabel...
>
> Bare for at være pedant (en arbejdsskade), så er operatorens navn
> "(the) conditional operator". Den er en "ternary operator" ("ternær
> operator" på dansk) ved det at den tager tre operander, lige som * er
> en "binary/binær" operator. Den er så den eneste ternære operator, så
> man kan tale om "the ternary operator", men det er ikke det den faktisk
> hedder.

Jeg kalder den ternei, og har altid gjort. Kan simpelthen ikke huske
det andet.. :/
Selvom lige nu er "Conditional Operator" temmelig indlysende. Men det
holder nok kun til næste gang jeg skal bruge det.
Men det understreger så også forskellen. Det er en operator, hvor if er
en statement.

> Personligt synes jeg det første er letter at læse.
> Betingelses-operatoren er gør sjældent ting nemmere at overskue, da den
> mangler de læselige nøgleord som "if" og "else". De små "?"- og ":"-tegn
> forsvinder nemt i mylderet hvis man har bare lidt komplekse udtryk mellem
> dem.

Afhægigt af anvendelsen, er det da noget vi godt kan blive enige om.
I det aktuelle tilfælde, ser jeg nu ikke noget problem. Det er jo nok
også afhængigt af vaner.

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Lasse Reichstein Nie~ (02-08-2011)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 02-08-11 16:30

scootergrisen <scootergrisen@gmail.com> writes:

> Jeg har læst om at man kan vente i javascript sådan her :
>
> window.setTimeout(afterDelay, 5000);
>
> function afterDelay() {
> alert("5 seconds have passed");
> }
>
> Men behøver man virkelig skulle kalde en funktion bare fordi man vil
> vente ?

Man skal kalde en funktion hvis man vil have noget udført senere.

Teknisk set kan man "vente", men JavaScript i browsere er event-baseret,
så der sker ikke andet i browseren før det nuværende script slutter.

Det vil sige at hvis du aktivt venter[1] i fem sekunder, så kan brugeren
ikke gøre andet (fx klikke på noget andet på siden) undervejs.
Derfor bruger man event-systemet til at *udsætte* udførslen af kode,
sådan at der er frit spil for brugeren indtil tiden udløber.


> Lad os sige jeg vil tegne nogle billederne oven på hinanden med
> javascript sådan at det bliver en animation.
>
> Så vil jeg gerne kunne skrive noget i stil med :
>
> tegnbilled(1);
> vent(1000); // 1 sekund
> tegnbilled(2);
> vent(1000); // 1 sekund
> tegnbilled(3);
> vent(1000); // 1 sekund
> tegnbilled(4);
> vent(1000); // 1 sekund
>
> Hvis man nu skal bruge setTimeout(); kan man så ikke gøre det uden at
> kalde en funktion ?

Nej.

> setTimeout(false, 1000); eller sådan noget ?
> Sådan at den bare stå der og venter 1 sekunder også forsætter.

Nej.
Men hvis man skriver koden til det, så er det ikke så slemt.


var counter = 1;
function animate() {
tegnbillede(counter);
counter++;
if (counter > 4) {
clearInterval(intervalId);
}
}
var intervalId = setInterval(animate, 1000);
animate(); // Eller vent et sekund med første animations-frame.


/L
[1] At vente aktivt (lad være!) kan gøres ved:
function BusyWait(ms) {
// Ældre browsere skal bruge (new Date().getTime()) i stedet
// for Date.now().
var limit = Date.now() + ms;
while (Date.now() < limit);
}
--
Lasse Reichstein Holst Nielsen
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

scootergrisen (12-08-2011)
Kommentar
Fra : scootergrisen


Dato : 12-08-11 02:33

Ok tak for svaret begge to.

Jeg tror nu bedre jeg forstår grunden til der ikke er sådan en
wait(1000); fordi som i skrvier ville det sætte pause på alt.

Jeg bruger nu setTimeout()

I kan se koden her hvor jeg har lavet en animation som skifter
billedede hvert sekund ligesom et GIF billede :
http://scootergrisen.dk/htmlgrisen/kode_canvas_animation.php#test_1

PS : Eksemplet under koden virker kun i nyere browsere som
understøtter HTML 5 <canvas> tagget.

Jeg er ikke så god til Javascript.
Hvis i har nogle bedre forslag til koden så skriv gerne.

Birger Sørensen (12-08-2011)
Kommentar
Fra : Birger Sørensen


Dato : 12-08-11 13:03

Den 8/12/2011, skrev scootergrisen:
> Ok tak for svaret begge to.
>
> Jeg tror nu bedre jeg forstår grunden til der ikke er sådan en
> wait(1000); fordi som i skrvier ville det sætte pause på alt.
>
> Jeg bruger nu setTimeout()
>
> I kan se koden her hvor jeg har lavet en animation som skifter
> billedede hvert sekund ligesom et GIF billede :
> http://scootergrisen.dk/htmlgrisen/kode_canvas_animation.php#test_1
>
> PS : Eksemplet under koden virker kun i nyere browsere som
> understøtter HTML 5 <canvas> tagget.
>
> Jeg er ikke så god til Javascript.
> Hvis i har nogle bedre forslag til koden så skriv gerne.

Rent prinipielt er type"text/javascript" deprecated i HTML 4.01. Det
hedder type="text/ecmascript". Og det bør det så hedde i HTML5.

Det kan ofte svare sig at bruge terney operator i stedet for if, hvor
man altid vil have returneret en vrædi, som skal tildeles samme
variabel...
Du har
index1++;
if(index1==allebilleder1.length){
index1=0;
}
det (kan) skrives som
index1 = (index1 < allebilleder1.length-1) ? index1+1 : 0;
(
Det er det samme som
if (index1 < allebilleder1.length-1) { index1 = index1+1; } //index++
else { index1 = 0; }
)

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Christian Hansen (12-08-2011)
Kommentar
Fra : Christian Hansen


Dato : 12-08-11 19:23

On 08/12/2011 02:02 PM, Birger Sørensen wrote:

> Det kan ofte svare sig at bruge terney operator i stedet for if, hvor
> man altid vil have returneret en vrædi, som skal tildeles samme variabel...
> Du har
> index1++;
> if(index1==allebilleder1.length){
> index1=0;
> }
> det (kan) skrives som
> index1 = (index1 < allebilleder1.length-1) ? index1+1 : 0;

I dette tilfælde kan man også blot bruge:

if ( ++index1 >= allebilleder1.length ) index1 = 0;

Venligst

Christian

Birger Sørensen (12-08-2011)
Kommentar
Fra : Birger Sørensen


Dato : 12-08-11 22:49

Den 12-08-2011, skrev Christian Hansen:
> On 08/12/2011 02:02 PM, Birger Sørensen wrote:
>
>> Det kan ofte svare sig at bruge terney operator i stedet for if, hvor
>> man altid vil have returneret en vrædi, som skal tildeles samme variabel...
>> Du har
>> index1++;
>> if(index1==allebilleder1.length){
>> index1=0;
>> }
>> det (kan) skrives som
>> index1 = (index1 < allebilleder1.length-1) ? index1+1 : 0;
>
> I dette tilfælde kan man også blot bruge:
>
> if ( ++index1 >= allebilleder1.length ) index1 = 0;
>
> Venligst
>
> Christian

Jo.
Det var lidt tanken at henlede grisens opmærksomhed på ternei...
Og så har dit eksempel i øvrigt samme opbygning : der lægges en til et
tal, hvorefter det checkes og sættes til 0, hvis en betingelse er
opfyldt.
Det er emm (jeg er nok gammeldags) bedre programmering, at finde ud af
hvad man har brug for, før man bruger tid og kræfter på at regne...
Men henter jo ikke vand i brønden for at hælde det ud, hvis man ikke
har brug for det...

Men du har da ret - det gør det samme.

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Christian Hansen (12-08-2011)
Kommentar
Fra : Christian Hansen


Dato : 12-08-11 21:24


> Og så har dit eksempel i øvrigt samme opbygning : der lægges en til et
> tal, hvorefter det checkes og sættes til 0, hvis en betingelse er opfyldt.
> Det er emm (jeg er nok gammeldags) bedre programmering, at finde ud af
> hvad man har brug for, før man bruger tid og kræfter på at regne...
> Men henter jo ikke vand i brønden for at hælde det ud, hvis man ikke har
> brug for det...


Hvad gør så : index1 < allebilleder1.length-1 ? I dit eksempel risikerer
man jo at lave 2 beregninger i stedet for kun en i mit eksempel.

Først skal den beregne allebilleder1.length -1 og hvis det samlede
udsagt er sandt, så skal den beregne index1 + 1 :)

Venligst

Christian

--
Christian Hansen
http://www.resource-it.dk/

Søg
Reklame
Statistik
Spørgsmål : 177577
Tips : 31968
Nyheder : 719565
Indlæg : 6409070
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste