Phenquestions
Introduktion
JavaScript är ett välkänt programmeringsspråk. Den används på mer än 95% av de webbplatser vi interagerar med dagligen. Du kan ofta se att genom att klicka på en knapp ändras en hel sida, ett formulärfält öppnas eller en popup-ruta visas. Ur perspektivet för en programmerare / utvecklare, hur kan vi implementera sådan funktionalitet och hantera webbplatsens interaktioner med användare? När det gäller interaktion tillhandahåller JavaScript inbyggda funktioner för att kontrollera händelser på en webbplats.
Det finns två typer av händelser i JavaScript:
- Event Listener - lyssnar och väntar på att evenemanget ska få sparken
- Händelsehanterare - utförs när en händelse avfyras
I den här artikeln kommer du att lära dig mer om den mest använda händelsehanteraren för JavaScript onClick händelse. Det finns andra händelsehanterare för att sväva över ett element eller för tangenttryckningar, men i den här artikeln kommer vi att fokusera på onClick-händelsen.
OnClick-händelsen används för att utföra vissa uppgifter med ett klick på en knapp eller genom att interagera med ett HTML-element.
Vi visar dig nu ett exempel för att visa hur onClick-händelsen fungerar.
Exempel: Ändra text med onClick
I det här exemplet ändrar vi ett textval genom att klicka på en knapp med hjälp av onClick-händelsen. Först kommer vi att skapa en stycke-tagg och ge den ett ID-stycke för att komma åt den senare. Vi skapar en knapp med onClick-händelsen och kallar funktionen ”ändra.”
Linuxhint
I skriptfilen skapar vi en flaggvariabel som gör det möjligt för oss att kontrollera status för texten i vår HTML-stycketag. Sedan kommer vi att skriva en funktion som definierar "ändra" -funktionen. I funktionsdefinitionen skapar vi ett ”if” -uttalande, där vi kontrollerar statusen med hjälp av flaggvariabeln. Vi kommer också att ändra texten och ändra flaggan. Det är en ganska enkel kod!
var a = 1;funktionsändring ()
om (a == 1)
dokumentera.getElementById ("avsnitt").innerHTML = "Linuxhint är fantastiskt"
a = 0;
annat
dokumentera.getElementById ("avsnitt").innerHTML = "Linuxhint"
a = 1;
Okej! Efter att ha skrivit all den här koden kommer vi att köra koden, flytta till vår webbläsare och klicka på den nyskapade knappen. Efter att ha klickat på knappen bör texten ändras från “Linuxhint” till “Linuxhint är fantastisk.”
Vi kan använda samma teknik var som helst för att ändra innehållet på vår webbplats efter våra behov. Vi kan använda den för att ändra en bild eller utföra någon typ av uppgift som vi kan föreställa oss med det här verktyget.
Slutsats
Den här artikeln förklarar hur man använder onClick-händelsen. I den här artikeln lärde du dig begreppet onClick-funktionen på ett praktiskt sätt. Användningen av onClick-händelsen är så enkel att även en nybörjare kan börja arbeta med den här funktionen. Du kan fortsätta lära dig, arbeta och få mer erfarenhet av JavaScript på linuxhint.com för att få ett bättre grepp om detta programmeringsspråk. Tack så mycket!
