JavaScript onClick

JavaScript onClick

Wstęp

JavaScript to znany język programowania. Jest używany w ponad 95% stron internetowych, z którymi codziennie wchodzimy w interakcje. Często możesz zobaczyć, że po kliknięciu przycisku zmienia się cała strona, pole formularza jest otwarte lub pojawia się wyskakujące pole. Z perspektywy programisty/programistę, w jaki sposób możemy wdrożyć taką funkcjonalność i obsługiwać interakcje witryny z użytkownikami? Jeśli chodzi o interakcję, JavaScript zapewnia wbudowane funkcje do kontrolowania zdarzeń na stronie.

Istnieją dwa rodzaje zdarzeń w JavaScript:

  • Słuchacz wydarzenia - słucha i czeka na zwolnienie wydarzenia
  • Handler zdarzeń - Wykonane, gdy wydarzenie jest zwolnione

W tym artykule dowiesz się o najczęściej używanym obsłudze zdarzeń JavaScript, na kliknięcie wydarzenie. Istnieją inne osoby zajmujące się unoszeniem się nad elementem lub naciskami klawiatury, ale w tym artykule skupimy się na wydarzeniu OnClick.

Zdarzenie onClick służy do wykonywania niektórych zadań za kliknięciem przycisku lub przez interakcję z elementem HTML.

Pokazamy teraz przykład, aby pokazać, jak działa wydarzenie OnClick.

Przykład: Zmień tekst za pomocą onClick

W tym przykładzie zmienimy wybór tekstu przy kliknięciu przycisku za pomocą zdarzenia OnClick. Najpierw stworzymy tag akapitu i podamy mu identyfikator „akapitu”, aby uzyskać do niego dostęp. Utworzymy przycisk z wydarzeniem OnClick i wywołamy funkcję o nazwie „Zmiana."

Linuxhint


W pliku skryptu utworzymy zmienną flagową, która pozwoli nam sprawdzić status tekstu w naszym znaczniku akapitu HTML. Następnie napiszemy funkcję definiującą funkcję „Zmień”. W definicji funkcji utworzymy instrukcję „If”, w której sprawdzimy status za pomocą zmiennej flagi. Zmienimy również tekst i zmienimy flagę. To dość prosty kawałek kodu!

var a = 1;
funkcja zmiana ()
if (a == 1)
dokument.getElementById („akapit”).innerHtml = "Linuxhint jest niesamowity"
a = 0;
w przeciwnym razie
dokument.getElementById („akapit”).innerHtml = "Linuxhint"
a = 1;

W porządku! Po napisaniu całego tego kodu uruchomimy kod, przeniesiemy się do naszej przeglądarki i klikniemy nowo utworzony przycisk. Po kliknięciu przycisku tekst należy zmienić z „Linuxhint” na „Linuxhint jest niesamowity."

Możemy zastosować tę samą technikę w dowolnym miejscu, aby zmienić treść naszej witryny zgodnie z naszymi potrzebami. Możemy go użyć do zmiany obrazu lub wykonywania dowolnego rodzaju zadania, które możemy sobie wyobrazić za pomocą tego narzędzia.

Wniosek

W tym artykule wyjaśniono, jak korzystać z wydarzenia OnClick. W tym artykule nauczyłeś się pojęcia funkcji OnClick w praktyczny sposób. Wykorzystanie wydarzenia OnClick jest tak proste, że nawet początkujący może rozpocząć pracę z tą funkcją. Możesz kontynuować naukę, pracę i zdobywanie większego doświadczenia w JavaScript w Linuxhint.com, aby lepiej zrozumieć ten język programowania. Bardzo dziękuję!