Når du oppretter sider, er det noen ganger nødvendig at når du klikker på knappen som er plassert på siden, skjer det en hendelse som er programmert av forfatteren i nettleseren. For å gjøre dette, må du plassere JavaScript-kode i det genererte dokumentet og binde den til ønsket knapp. Avhengig av hvor mye kode som kreves for å implementere den tiltenkte hendelsen, kan du bruke forskjellige måter å koble knappen til koden på.
Bruksanvisning
Trinn 1
Ofte er JavaScript-kodesamtaler bundet til onclick-hendelsen, det vil si til klikk på venstre museknapp. Hvis du ikke trenger mye kode for å beskrive handlingen som må skje, kan alt dette plasseres direkte i knappekoden. For eksempel, for å programmere nettleseren til å vise en enkel melding når du klikker på en knapp, vil JavaScript-skriptet se slik ut: varsel ('Koden fungerte!') Det tar bare ett utsagn og en tekst. Alt dette kan enkelt plasseres i onclick-hendelsesbeskrivelsen til knappekoden. I dette tilfellet kan den enkleste HTML-koden på siden se slik ut:
Knapp med kode
Knapp med kode
Steg 2
Det er ikke praktisk å plassere mer kompleks JavaScript-kode direkte i knappekoden. Det er lettere å lage en egen funksjon av det, og legge anropet i onclick-hendelsen. Dette kan for eksempel se ut som en funksjon som viser et vindu som inneholder tidspunktet for et knappeklikk: funksjon getTime () {
var nå = ny dato ();
varsel ("Koden fungerte i" + now.getHours () + ":" + now.getMinutes ());
} Den skal plasseres i toppteksten på siden (mellom taggene og). Den komplette koden til siden med en samtale til denne funksjonen bundet til knappen kan se slik ut:
Funksjonsknapp
funksjon getTime () {
var nå = ny dato ();
varsel ("Koden fungerte i" + now.getHours () + ":" + now.getMinutes ());
}
Funksjonsknapp
Trinn 3
Den samme metoden skal brukes når du klikker på flere forskjellige knapper, bør du få en hendelse som kan beskrives med den samme JavaScript-koden. For eksempel kan du endre den forrige funksjonen litt for å legge til identifikasjonen av den trykkte knappen i meldingsboksen: function getTime (btnString) {
var nå = ny dato ();
varsel (btnString + "klikket inn" + now.getHours () + ":" + now.getMinutes ());
} Den komplette koden for en side med tre slike knapper kan se slik ut:
Tre knapper med funksjonsanrop
funksjon getTime (btnString) {
var nå = ny dato ();
varsel (btnString + "klikket inn" + now.getHours () + ":" + now.getMinutes ());
}
Første knapp
Andre knapp
Tredje knapp
