Jak wywołać zdarzenie kliknięcia w JavaScript

Podczas programowania w JavaScript często spotykamy się z sytuacjami, w których chcemy wywołać dowolną funkcję po kliknięciu przycisku. Na przykład w przypadku testowania automatyzacji musisz przetestować dodatkową funkcjonalność strony internetowej lub witryny. W takich scenariuszach technika wyzwalania zdarzeń kliknięcia w JavaScript staje się bardzo przydatna i skuteczna w przeciwdziałaniu określonym wyzwaniom.

Ten zapis poprowadzi Cię na temat procedury wywołania zdarzeń kliknięcia w JavaScript.

Jak wywołać zdarzenie kliknięcia w JavaScript?

Aby wyzwolić zdarzenie kliknięcia w JavaScript, zastosuj następujące techniki:

• "Kliknij()" metoda
• "addEventListener ()" I "DispatchEvent ()”Metody

Teraz zademonstrujemy zastosowanie wyżej wymienionych metod jeden po drugim!

Metoda 1: Wykonanie Trigger Click w JavaScript za pomocą metody kliknięcia ()

„„Kliknij()”Metoda służy do wykonania kliknięcia określonego elementu. Tę metodę można zaimplementować, tworząc przycisk, otrzymując jego identyfikator i wyzwalając zdarzenie kliknięcia, gdy przycisk zostanie kliknięty za pomocą funkcji zdefiniowanej przez użytkownika.

Przejrzyj następujący przykład demonstracji.

Przykład
W poniższym przykładzie zostanie dodany przycisk z posiadaniem „Kliknij”Jako jego identyfikator i powiązane wydarzenie OnClick, które będzie dostępu do„clickevent ()”Funkcja:

Kliknij

W kodzie JavaScript uzyskaj dostęp do przycisku utworzonego, określając jego identyfikator w dokumencie.metoda getelementById (). Następnie wywołana zostanie metoda „kliknij ()”, aby wykonać dalszą operację:

const get = dokument.getElementById („btn”);
Dostawać.Kliknij();

Na koniec zdefiniuj funkcję o nazwie „clickevent ()”W taki sposób, że wydrukuje następującą wiadomość na konsoli, gdy przycisk zostanie klikany za pomocą„Kliknij()" metoda:

funkcja clickevent ()
konsola.Log („Click Event uruchomiono”)

Wyjście powyższej implementacji spowoduje następujący sposób:

Na powyższym wyjściu obserwuje się, że przycisk „Kliknij”Jest klikany w zautomatyzowany sposób za pomocą„Kliknij()" metoda. Tymczasem dostęp do funkcji Clickevent (), a określony komunikat jest rejestrowany na konsoli.

Metoda 2: Wydarzenie Trigger Click w JavaScript za pomocą metod „addEventListener ()” i „DispatchEvent ()”

„„addEventListener ()„Metoda dołącza obsługę zdarzeń do obiektu DOM i„DispatchEvent ()”Metoda wysyła określone zdarzenie do obiektu. Metody te można użyć w połączeniu do utworzenia nowego obiektu zdarzenia i wykonania zdarzenia kliknięcia za pomocą określonej funkcji.

Składnia

dokument.addEventListener (zdarzenie, funkcja)

W powyższej składni „wydarzenie”Odnosi się do określonego wydarzenia i„funkcjonować”Jest funkcją, na której ma zastosowanie zdarzenia.

DispatchEvent (wydarzenie)

Tutaj, "wydarzenie”Odnosi się do wybranego obiektu zdarzenia, który należy wysłać.

Przegląd następujący przykład.

Przykład
Pierwszym krokiem jest dołączenie przycisku z identyfikatorem, zdarzeniem onClick i wartości omówionej w poprzedniej metodzie:

Kliknij

Następnie przycisk i dodaj wydarzenie „Kliknij" używając "addEventListener ()„Metoda i określ”mi”W argumencie, który odnosi się do obiektu zdarzenia (kliknij). A później "DispatchEvent ()„Metoda wyśle ​​zdarzenie kliknięcia do obiektu o nazwie„Wydarzenie”Jak pokazano:

const get = dokument.getElementById („btn”);
Dostawać.addEventListener („kliknij”, e => );
Dostawać.DispatchEvent (nowe wydarzenie („kliknij”));

Wreszcie zdefiniuj tę samą funkcję Clickevent (), jak stwierdzono w poprzedniej metodzie, aby wyświetlić odpowiedni komunikat, gdy „Kliknij„Wydarzenie jest wyzwalane:

funkcja clickevent ()
konsola.Log („Click Event uruchomiono”)

Wyjście

Skompilowaliśmy różne metody wyzwalania zdarzeń kliknięcia w JavaScript.

Wniosek

Aby wyzwolić zdarzenia kliknięcia w JavaScript, „Kliknij()”Metodę można zastosować w celu pobrania przycisku i odpowiednio wywołania dodanej funkcji. Także „„addEventListener ()" I "DispatchEvent ()„Metody można wykorzystać do zawierania określonego zdarzenia i wysłania go do nowo utworzonego obiektu. W tym artykule pokazano metody wyzwalania zdarzeń kliknięcia w JavaScript.