Jak usunąć słuchacz zdarzeń w JavaScript? |. Wyjaśniono przykładami

Jak usunąć słuchacz zdarzeń w JavaScript? |. Wyjaśniono przykładami
JavaScript jest wysoce używany w tworzeniu stron internetowych. Będąc dynamicznym językiem, łatwo jest zmienić zachowania strony w czasie wykonywania. Zwykle jest łatwiejsze w użyciu w środowisku po stronie klienta, ponieważ jesteśmy w stanie bardzo szybko wprowadzać zmiany. Dzisiaj porozmawiamy o kolejnej operacji JavaScript, w jaki sposób możemy łatwo usunąć słuchacz zdarzenia z wydarzenia.

Usunięcie słuchacza zdarzeń za pomocą JavaScript

Usunięcie słuchacza zdarzenia z określonego elementu HTML może być w niektórych przypadkach tak ważne, ponieważ nie chcesz, aby wydarzenie było wyzwalane wiele razy bez powodu. JavaScript może być bardzo pomocne w osiągnięciu tej funkcji, więc zobaczmy, jak możemy łatwo wykonać tę pracę.

Metoda removeVentListener ()

RemoveventListener () to wbudowana funkcja w JavaScript, której można użyć do usunięcia słuchaczy zdarzeń z elementów HTML.Załóżmy, że masz następujący słuchacz zdarzenia dołączony do elementu:






Załóżmy teraz, że chcesz usunąć zdarzenie kliknięcia z przycisku, będziesz potrzebować odniesienia zarówno do elementu zawierającego słuchacz, jak i odniesienie funkcji zwrotnej, aby skutecznie usunąć słuchacz zdarzenia. Aby usunąć zdarzenie „kliknij”, kod pójdzie w ten sposób:

Btn.removeventListener („kliknij”, kliknięte)

Jednak nie jest dobrym pomysłem przekazanie słuchacza zdarzenia bezimiennej funkcji oddzwonienia:

Btn.addEventListener („kliknij”, (e) =>
Alert („ten przycisk został kliknięty”);
)

Nie będziesz w stanie usunąć słuchacza zdarzeń bez nazwy funkcji zwrotnej, jak pokazano w powyższym przykładzie.

Usunięcie słuchacza zdarzeń po kliknięciu przycisku

Czasami możesz nie chcesz, aby przycisk został kliknięty dwukrotnie, jakby został kliknięty, zdarzenie uruchomi się i spowoduje problemy z przetwarzaniem w ramach wydarzenia. Aby natychmiast poradzić sobie z tym problemem, musimy dołączyć removeventListener () w środku addeveNetListener () metoda. Zobaczmy, jak możemy osiągnąć tę funkcjonalność w poniższym kodzie:






Wyjście:

Tak więc przy powyższym przykładzie, po kliknięciu przycisku, uruchomiłby to załączone zdarzenie i usunie to zdarzenie po wyłączeniu przycisku, aby uniknąć wielu kliknięć w tym samym czasie od użytkownika.

W ten sposób pozbywasz się słuchaczy wydarzenia JavaScript z elementów HTML. Aby usunąć słuchacz zdarzeń z elementu HTML, musisz zająć się dwiema rzeczami, musisz zdefiniować rodzaj zdarzenia, a drugą rzeczą jest to, że musisz podać funkcję odniesienia dołączoną do słuchacza zdarzenia.

Wniosek

removeventListener () Metoda jest stosowana, gdy jesteś potrzebny do usunięcia zdarzenia z określonego elementu HTML. Ta metoda wymaga dwóch argumentów, pierwszym argumentem będzie nazwa zdarzenia, podczas gdy drugim argumentem będzie funkcja dołączona do słuchacza zdarzenia. W tym artykule widzieliśmy przykład, w którym omówiliśmy, w jaki sposób możemy po prostu usunąć zdarzenie dołączone do elementu HTML.