|
 | |||||||||||||||||
| |||||||||||||||||
| |||||||||||||||||
| EchoEcho.Com KOMPLETT KURS |
HEM  KURSER JAVASCRIPT
GRUND
|
EchoEcho.Com REDSKAP & RESURSER |
|||||||||||||||
| |||||||||||||||||
| |||||||||||||||||
| |||||||||||||||||
| |||||||||||||||||
| |||||||||||||||||
| | ||||||||||||||||
| | ||||||||||||||||
| | ||||||||||||||||
|
| ||||||||||||||||
|
|
|
|
Ett exempel skulle kunna vara händelsen onMouseOver, vilken inträffar när användaren för muspekaren över objektet. En annan händelse är onLoad , vilken inträffar så fort sidan är färdigladdad. Vanligtvis används händelser i kombination med funktioner, så att funktionen inte startar innan händelsen inträffar. Ett exempel skulle kunna vara en funktion som animerar en knapp. Funktionen alternerar helt enkelt mellan två bilder. En bild som visar knappen i ej nertryckt läge, och en som visar knappen i nertryckt läge. Om den här funktionen anropas via en onMouseOver händelse, kommer det att se ut som om knappen trycks ned när muspekaren går över bilden. Nedanför är de viktigaste händelserna som kan detekteras av ett javascript:
Händelser används huvudsakligen för två syften:
Nedanför är en kort beskrivning av de vanligaste användningsområdena för varje händelse. onFocus, onBlur och onChange används i huvudsak vid validering av formulärfält. Låt oss anta att du har en funktion som kallas validateEmail() som kollar om den skrivna email-adressen har ett @ i sig, och om den har en meningsfull ändelse som "com", "net" eller vad som helst. Låt oss sen anta att användaren kan skriva sin email-adress i ett fromulär. Då behöver du använda onChange händelsen för att aktivera funktionen när helst användaren ändrar innehållet i ett fält:
Klicka här för att lära dig mer om formulär. Klicka här för att lära dig mer om validering av formulär-fält. onLoad och onUnload används i huvudsak för popups som visas när användaren kommer in på eller lämnar en sida. Ett annat viktigt användningsområde är i samband med cookies som skall aktiveras när besökaren kommer in på eller lämnar sidan. Till exempel, har du kanske en popup som ber användaren att fylla i sitt namn första gången han /hon besöker sidan. Namnet lagras då i en cookie. När sedan besökaren lämnar din sida sparar cookien "dagens datum". Nästa gång besökaren kommer tillbaka till din sida, visas en annan popup ungefär så här: "Välkommen Göran Persson, den här sidan har inte uppdaterats sen ditt senaste besök för 8 dagar sen". Klicka här för att lära dig mer om att lägga in cookies. Klicka här för att lära dig mer om popup-boxes. Ett annat vanligt användningsområde för onLoad och onUnload händelser är: Vissa irriterande sidor har en funktion som gör att det genast öppnas flera olika fönster så fort du kommer in på sidan. Det här är ett klart brott mot netiquetten, och anses inte vara god webdesign. onSubmit används i huvudsak av en enda orsak: För att validera alla fält i ett formulär innan det skickas. I det övre exemplet om onChange visade vi hur du kan validera ett enskilt formulär-fält. Hur som helst, ibland tycker besökaren att det är irriterande att ha valideringar hela tiden efterhand som han /hon fyller i fälten i formuläret. Istället för att validera efter varje input, så kan det vara bättre att formuläret valideras när besökaren klickar på sänd-knappen. Det görs med hjälp av användandet av onSubmit händelsen. Låt oss säga att du skapat en funktion som heter checkform() som validerar det som läggs in i ett formulär. Nu vill du att den är funktionen skall anropas när användaren klickar på sänd-knappen. Om innehållet inte godkänts av din funktion så avbryts sändningen. På det här sättet skickas inget om inte din funktion godkänt innehållet. Du bör göra följande: Lägg till en onSubmit händelse till <form> taggen så här:
Funktionen checkform() returnerar antingen sant eller falskt. Om resultatet är sant skickas formuläret. Om resultatet är falsk så avbryts försändelsen. Klicka här för att lära dig mer om formulär. Klicka här för att lära dig mer om formulär-validering. onMouseOver och onMouseOut används i huvudsak av en orsak: För att åstadkomma animerade knappar. Du har kanske lagt märke till att de här händelserna bara kan användas i kombination med länk taggen <a>. Hur som helst, händelserna är oftast mer användbara i kombination med bild taggen <img>. Knepet för att få händelsen att fungera på en bild är att helt enkelt skapa en länk av bilden. (det är inte meningen att bilden skall fungera som en vanlig länk, du kan ju alltid länka till ett tomt ankare, som visas i exemplet nedanför). Exempel: en alert-box visas när en onMouseOver inträffar på en bild:  HTML-koden för exemplet:
Notera: href="#" länkar bilden till ingenstans. Om du istället vill att bilden skall länka till någon sida, så skall du skriva adressen till sidan här i stället. Klicka här för att lära dig mer om länkar och ankare. Klicka här för att lära dig mer om alert-boxar.
|
|
| |
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
|
| | ||||||||||||||||||
| | ||||||||||||||||||
| | ||||||||||||||||||
| EchoEcho.Com KOMPLETT KURS |
|
EchoEcho.Com REDSKAP & RESURSER |
|||||||||||||||||
| |||||||||||||||||||
| |||||||||||||||||||
| |||||||||||||||||||
| |||||||||||||||||||
(c) Copyright 1998-2000 NetKontoret - All Rights Reserved | |||||||||||||||||||
| |||||||||||||||||||
| |||||||||||||||||||
| |||||||||||||||||||
| |||||||||||||||||||
