EchoEcho.Com
KOMPLETTE WEBKURSER

HJEM

KURSER

JAVASCRIPT

INTRO

EchoEcho.Com
TOOLS & RESSOURCER

HJEM

KURSER

RESSOURCER

REDSKABER

DOKUMENTATION

OVERSIGT

SØG PÅ DETTE SITE

FORESLÅ DETTE SITE




JAVASCRIPT INTRO




	INTRODUKTION

	PLACERING I HTML

	DET FØRSTE SCRIPT

	STORE BOGSTAVER

	POP UP BOXE

	VARIABLE

	IF OG ELSE

	FUNKTIONER

	EVENTS

	LOOPS

	ARRAYS

JavaScript :
EVENTS

Events er handlinger, der kan spores af Javascript.

Et eksempel kunne være onMouseOver-eventen, som spores, når brugeren bevæger musen henover et objekt.

En anden event er onLoad-eventen, som bliver sporet, så snart siden er færdig med at loade.

Normalt bruges events i kombination med funktioner, for at funktionen ikke starter, før eventen har fundet sted.

Et eksempel kunne være en funktion, som animerer en knap.

Funktionen skifter simpelthen mellem to billeder - et billede, som viser knappen i up-state, og et andet billede, som viser knappen i down-state.

Hvis denne funktion kaldes en onMouseOver-event, så vil den få det til se ud som om, at knappen trykkes ned, når musen bevæges hen over billedet.

Følgende er de vigtigste events, der bliver sporet af Javascript:

Event	Spores når	HTML-tags
onFocus=""	Form-felter får fokus	Udvælg, Tekst, Tekstområde
onBlur=""	Form-felter mister fokus	Udvælg, Tekst, Tekstområde
onChange=""	Indholdet i et felt ændres	Udvælg, Tekst, Tekstområde
onSelect=""	Tekst udvælges	Tekst, Tekstområde
onMouseOver=""	Musen bevæger sig hen over et link	A
onMouseOut=""	Musen bevæger sig væk fra et link	A
onClick=""	Musen klikker på et objekt	A, Knap, Tjekboks, Radio, Reset, Submit
onLoad=""	Siden er færdig med at loade	Body, Frameset
onUnload=""	Browseren åbner nyt dokument	Body, Frameset
onSubmit=""	Der trykkes på submit-knappen	Form

Events bliver brugt af to hovedårsager:

For at udføre en funktion efter at have sporet eventen, og/eller

For at vise pop-op-bokse efter at have sporet eventen.

Nedenfor er en kort beskrivelse af hovedårsagerne til hver enkelt event.

onFocus, onBlur og onChange bruges hovedsageligt i kombination med form-felters gyldighed.

Lad os antage, at du har en funktion kaldet validateEmail(), som tjekker, om en indtastet email-adresse har et @ i sig, og om den har en meningsfuld slutning såsom "com", "net" etc. Lad os ydermere antage, at brugeren kan indtaste sin email-adresse i en form.

I dette tilfælde skal du bruge onChange-eventen for at kalde funktionen, hver gang brugeren ændrer indholdet i feltet:

<input type="text" size="20" onChange="validateEmail()">;

Klik her for at lære mere om forms.
Klik her for at lære mere om form-felt-gyldighed.

onLoad og onUnload bruges hovedsageligt til pop-op'er, som vises, når brugeren kommer ind på eller forlader siden.
En anden vigtig brug er i kombination med cookies, som bør sættes ved ankomsten til eller afskeden med siden.

Du har måske en pop-op, som beder brugeren om at indtaste sit navn første gang, han/hun kommer ind på siden. Navnet lagres så i en cookie. En cookie lagrer ydermere datoen, når den besøegnde forlader din side.
Næste gang den besøgende kommer ind på din side, vil en pop-op sige: "Velkommen Bill Clinton, denne side er ikke blevet opdateret, siden sidst du besøgte den for 8 dage siden".

Klik her for at lære mere om at indsætte cookies.
Klik her for at lære mere om pop-op-bokse.

En anden mere eller mindre almindelig brug af onLoad og onUnload-events er dette: Nogle irriterende sider har en funktion, som med det samme åbner flere andre vinduer, så snart du kommer ind på siden. Dette er et klart brud på netiketten, og bliver ikke anset for at være godt web-design.

onSubmit bliver brugt af én eneste årsag: At vurdere alle felter i en form, før de faktisk bliver sendt.

I ovennævnte eksempel med onChange viste vi, hvordan du kan vurdere et enkelt form-felt.

Nogle gange vil den besøgende dog finde det irriterende at få vurderinger lige midt i indtastningen i en forms felter. I stedet for at vurdere efter hvert input, kunne du vente med at lade formen blive vurderet til brugeren klikker på sendeknappen.

Det kan gøres ved at bruge onSubmit-eventen.

Antag at du lavede en funktion kaldet checkform(), som vurderede indtastninger i en form.

Nu vil du have, at denne funktion bliver kaldt, når brugeren klikker på sendeknappen.
Hvis indholdet ikke accepteres af din funktion, skal afsendelsen annulleres.
På denne måde bliver intet sendt, med mindre din funktion accepterer indholdet.

Du skal gøre følgende: indsæt en onSubmit-event i <form>-tagget på denne måde:

<form method="ditvalg" action="ditvalg" onsubmit="returner tjekform()">

Funktionen tjekform() returnerer enten sand eller forkert.
Hvis den returnerer sand vil afsendelsen blive gennemført.
Hvis den returnerer forkert vil afsendelsen blive annulleret.

Klik her for at lære mere om forms.
Klik her for at lære mere om formgyldighed.

onMouseOver og onMouseOut bruges hovedsageligt af en årsag: Til at lave animerede knapper.

Måske har du bemærket, at disse events kun kan bruges i kombination med link-tagget <a>.

Men events er ofte mere brugbare i kombination med billed-tagget <img>. Kunsten at få eventen til at fungerer på et billede er simpelthen at lave billedet om til et link (hvis billedet ikke rent faktisk skal fungere som et link, kan du altid få det til at linke til et tomt anker, som vist i eksemplet nedenfor).

Eksempel: en alert-boks dukker op, når en onMouseOver spores på et billede:

HTML'en i eksemplet:

NB: a href="#" linker billedet til ingenting. Hvis du faktisk ønsker, at billedet skal linkes til en side, skal du i stedet indtaste adressen på siden her.

Klik her for at lære mere om links og # ankre.
Klik her for at lære mere om alert-bokse.

<< TILBAGE

LÆS MERE >>




JAVASCRIPT MENU




	JAVASCRIPT INTRO

	ANIMEREDE KNAPPER

	BROWSER DETECTION

	COOKIES

	POPUP VINDUER

	DROP DOWN MENU

	FORM VALIDERING

	FRAMESET SCRIPT

	MULTI LINK