Knappar på webbsidor används för att ge interaktiv användarupplevelse. Om svaret på ett knappklick inte kräver att data skickas till servern, implementeras interaktionen som regel med JavaScript-skript. Metoderna för att anropa motsvarande JavaScript-kod kan variera - nedan finns flera möjliga alternativ för knappar av olika slag.
Instruktioner
Steg 1
Om visningen av en knapp på en webbsida är organiserad med hjälp av knapptaggen kan JavaScript-koden placeras i attributet onclick. Till exempel, så här: knapp Det är naturligtvis inte tillrådligt att lägga tillräckligt stor kod direkt i knapptaggen - det är bättre att utforma den som en funktion och bara lägga in koden för att anropa den här funktionen till attributet onclick. Till exempel:
funktion showAlert () {
varning ('Knappen klickade!')
}
knapp
Steg 2
Om knappen visas genom en av ingångstaggvariationerna (skicka, återställa, knapp eller bild) kan samma onclick-attribut användas. Till exempel, för en knapp för att rensa formulärfält (återställning), kan koden se ut så här: Om du bara vill att JavaScript ska köras när du klickar på knappen och standardåtgärden inte sker, lägg sedan till kommandot retur i funktion eller direkt till onclick-attributet false. Till exempel:
Steg 3
Om du behöver organisera ett svar på att klicka på en knapp av inlämningstypen kan du, förutom ovanstående metod med att använda onclick-attributet, använda egenskaperna för den formtagg som denna knapp tillhör. Motsvarande funktionsanrop kan placeras i attributet onsubmit för formuläretiketten. Till exempel:
Steg 4
Om knappen inte är ett formelement utan bara ett grafiskt element (img-tagg), tillåter standarderna för det också att använda attributet onclick. Till exempel:
Steg 5
Om knappen är en hyperlänk ska du inte använda attributen för själva knappen; det är bättre att använda egenskaperna för länktaggen. Du kan, som i föregående alternativ, använda onclick-taggen. Till exempel: Och du kan ersätta adressen i attributet href med ett funktionssamtal. Till exempel så här:
