W zasadzie podczas programowania w JavaScript mamy do czynienia z pewną sytuacją, w której możemy stworzyć dowolną funkcję po kliknięciu przycisku. Na przykład musimy zbadać większą funkcjonalność w czasie testów automatycznych strony internetowej lub witryny. W takich przypadkach technika JavaScript wyzwalająca kliknięcie staje się bardziej niezawodna i skuteczna w przeciwdziałaniu określonym wyzwaniom.
W tym kontekście poznamy procedury zdarzeń kliknięcia wyzwalacza w JavaScript.
zastępca komisarza policji
Jak możemy wywołać zdarzenie kliknięcia w JavaScript:
Musimy zastosować techniki podane poniżej, aby wywołać zdarzenie kliknięcia w javascript:
a) metoda click().
b) metody addEventListener() i dispathEvent
Teraz użyjemy metod opisanych powyżej, aby zademonstrować, co następuje:
Metoda 1:
Wyzwalaj zdarzenie kliknięcia za pomocą metody zdarzenia kliknięcia w javascript:
Na wspomnianym elemencie tzw metoda kliknięcia służy do wykonania akcji. Metodę tę można wdrożyć za pomocą funkcji zdefiniowanej przez użytkownika, gdy użytkownik kliknie żądany przycisk za pomocą utworzenia przycisku, pobrania jego identyfikatora i wywołania zdarzenia kliknięcia.
Aby uzyskać dalsze wyjaśnienia, musimy przejść przez przykład podany poniżej:
Przykład:
W przykładzie podanym poniżej z posiadaniem 'Kliknij tutaj' , zostanie utworzony przycisk z identyfikatorem i zdarzeniem kliknięcia umożliwiającym dostęp do zdarzenia kliknięcia na nim;
Click here
Podając jego identyfikator w javascript, musimy uzyskać dostęp do utworzonego przycisku w metodzie document.getElementById. W celu wykonania kolejnej operacji zostanie wywołane zdarzenie kliknięcia.
const get= document.getElementById('btn'); get.click();
Na koniec, po kliknięciu przycisku, zdefiniujemy wydrukowanie następującej funkcji o nazwie „kliknięcieZdarzenie()” w ten sposób, że na konsoli metodą kliknięcia.
function clickEvent() { console.log('now the Click Event is triggered ') } Z powyższego wyniku odpowiedniego kodu, przy użyciu metody kliknięcia w sposób zautomatyzowany, zaobserwowaliśmy, że przycisk kliknij tutaj został kliknięty.
Metoda 2:
Wywołaj zdarzenie kliknięcia w JavaScript za pomocą metod addEventListener() i ekspedycjiEvent().
W javascript jest to metoda integralna udostępniana przez interfejs docelowy zdarzenia javascript.
Za pomocą tej metody rejestrowany jest detektor zdarzeń. Wywołamy naszą skonfigurowaną funkcję, gdy wspomniane zdarzenie zostanie przechwycone na celu.
Składnia zdarzenia:
target.addEventListener( $type, $listener); target.addEventListener( $type, $listener, $options); target.addEventListener( $type, $listener, $useCapture);
opis składni:
- W powyższej składni występuje parametr o nazwie $typ , który jest parametrem obowiązkowym. Parametry wskazujące rodzaj zdarzenia, które ma być monitorowane, przyjmują tylko jeden ciąg znaków. W tym parametrze uwzględniana jest wielkość liter. Obsługiwane są przez niego różne zdarzenia, takie jak klawiatura, kliknięcie, baza danych, wejście itp
- W ten sam sposób, $słuchacz jest również w nim obowiązkowym parametrem. Powiadomienie o zdarzeniu odbierane jest przez ten parametr jako obiekt w przypadku wystąpienia zdarzenia wymienionego typu. W funkcji javascript lub w interfejsie Eventlistner obiekt ten powinien zostać zaimplementowany.
- Z drugiej strony, $opcja jest parametr opcjonalny w tym.
Przykład 1
Open bing const link = document.getElementById('btn'); link.addEventListener('click', e => {}); for(let i = 0; i <5; i++) { link.dispatchevent(new event('click')); } function opengooglebymethod() console.log('the required event is triggered') < pre> <p> <strong>Output:</strong> </p> <pre> 'The required event is triggered'. 'The required event is triggered'. 'The required event is triggered'. 'The required event is triggered'. 'The required event is triggered'. </pre> <p> <strong>Example 2:</strong> </p> <p>In this example, first of all, we will include a button with a corresponding id with an onclick event along with a value as same as like previous one.</p> <pre> Click here </pre> <p>After that, with the help of the <strong> <em>addEventListener()</em> </strong> method, we will retrieve the button and click the event in it to specify the <strong> <em>'e'</em> </strong> in its argument, which refers to the event click object.</p> <pre> const get = document.getElementById('btn'); get.addEventListener('click', e => {}); get.dispatchEvent(new Event('click')); </pre> <p>Finally, as same as the previous method, we will define the click event to display the corresponding message in it at the time the click event is triggered.</p> <pre> function clickEvent() { console.log('The required event is triggered ') } </pre> <hr></5;> Przykład 2:
W tym przykładzie najpierw umieścimy przycisk o odpowiednim identyfikatorze ze zdarzeniem onclick i wartością taką samą jak poprzednio.
Click here
Następnie przy pomocy dodajEventListener() metodę, pobierzemy przycisk i klikniemy znajdujące się w nim zdarzenie, aby określić 'To jest' w swoim argumencie, który odwołuje się do obiektu kliknięcia zdarzenia.
rodzeństwo Kylie Jenner
const get = document.getElementById('btn'); get.addEventListener('click', e => {}); get.dispatchEvent(new Event('click')); Na koniec, podobnie jak w poprzedniej metodzie, zdefiniujemy zdarzenie kliknięcia, aby wyświetlić w nim odpowiedni komunikat w momencie wywołania zdarzenia kliknięcia.
function clickEvent() { console.log('The required event is triggered ') }