Hej där nere!

De flesta javaskript förutsätter att man placerar själva skriptet i HEAD-elementet på sin sida, medan anropet av skriptet sedan sker i BODY-elementet. I det här allra första skriptet hoppar vi emellertid över HEAD-biten och placerar skriptet direkt i BODY.

Vi skall göra en liten funktion som får en text att visas i webbläsarens statusrad (listen allra längst ned i webbläsarfönstret). Texten visas när du pekar på en länk (klicka inte – det öppnar bara den här sidan igen).

Peka här!

Normalt när man pekar på en länk visar statusraden adressen som länken leder till. Här visas i stället den text jag valde att placera i länken. Koden till detta ser ut så här:

<A HREF="01.html" onMouseover="window.status='Hej, här nere!'; return true">Peka här!</A>

Du ser att det hela börjar och slutar som en normal länk. Men där emellan finns ett javaskript, som består av tre delar:

onMouseover=" "
Den här biten betyder: När muspekaren hamnar på den här länken skall följande hända.

Det här är en så kallad händelsehanterare; den tar hand om händelsen att muspekaren pekar på något – i det här fallet länken.

windows.status=' '
Det här talar om vad det är som skall hända när muspekaren hamnar på länken.

return true
Slutligen kommer detta, som kort sagt betyder "gör som jag säger".

Eller: När muspekaren hamnar på länken skall texten "Hej, här nere!" visas i statusraden – gör detta nu.

Det spelar i grund och botten ingen roll om du använder enkla eller dubbla citationstecken, men skriptet måste kunna förstå vad som menas. Därför växlar man mellan enkla och dubbla citationstecken.

I exemplet ovan innebär det att hela koden "window.status='Hej, här nere!'; return true" uppfattas som "detta skall göras när händelsen onMouseover inträffar".

Om jag sätter dubbla citationstecken även runt "Hej, här nere!", förstår skriptet inte vad som skall göras. Följden blir att webbläsaren gör som den brukar: Visar adressen till länken i statusraden.

Fel på citationstecknen är nog den vanligaste orsaken till att javaskript inte fungerar.

Som vårt lilla skript nu ser ut, kommer texten att visas i statusraden. Men sedan händer inget mer. När muspekaren flyttas bort från länken, kommer texten att stå kvar i statusraden. Om man pekar på en annan länk visas visserligen adressen till den, men sedan kommer den fåniga lilla texten tillbaka. Så vill vi inte ha det.

Det finns alltså en händelsehanterare – onMouseover – som tar hand om händelsen att muspekaren pekar på något. Logiskt nog finns det även en händelsehanterare som tar hand om händelsen att musmarkören slutar peka på något, och lika logiskt är att den heter onMouseout.

Vi utnyttjar nu denna och anger att "när musen slutar peka på länken skall det inte visas text i statusraden".

Vi kan då använda samma kod som tidigare, men ändra window.status='Hej, här nere!' till window.status=' '.

Observera att likhetstecknet följs av två enkla citationstecken efter varandra, inte av ett dubbelt citationstecken. För att det här skall synas tydligare, har jag lagt ett mellanslag mellan citationstecknen, men du kan utesluta mellanslaget. Resultatet blir ändå att det inte visas någon text.

Vi har helt enkelt tagit bort texten mellan citationstecknen, och koden säger att statusraden skall visa "ingenting alls".

Koden kommer nu att innehålla: när musen pekar på länken + gör det här + gör det nu + när musen slutar peka på länken + gör det här + gör det nu.

Pröva här!

Hela kodsnutten nedan skall skrivas på en rad utan radmatning.

<A HREF="01.html" onMouseover="window.status='Den här texten försvinner när du flyttar muspekaren.'; return true" onMouseout="window.status=' '; return true">Pröva här!</A>

Den här metoden kan du använda för att förklara för besökaren vad sidan som länken leder till handlar om. Men tänk på att många hellre vill se internetadressen i statusraden.

© SupportData.Net