Ang isang kaganapan ay isang mahalagang bahagi ng Ang isang web page ay tumutugon alinsunod sa isang kaganapan na naganap. Ang ilang mga kaganapan ay nabuo ng gumagamit at ang ilan ay nabuo ng mga API. Sa artikulong ito, makikita natin kung paano nagaganap ang mga kaganapan at kung paano ginagamit ang pamamaraan, addEventListener sa JavaScript sa sumusunod na pagkakasunud-sunod:
- Ano ang Pakikinig sa Kaganapan?
- AddEventListener () sa JavaScript
- Mga Halaga ng Parameter
- AddEventListener sa JavaScript: Halimbawa
Ano ang Pakikinig sa Kaganapan?
Ang isang tagapakinig ng kaganapan ay isang pamamaraan sa JavaScript na naghihintay para sa isang kaganapan na maganap. Ang simpleng halimbawa ng isang pangyayari ay isang gumagamit na nag-click sa mouse o pinindot ang isang key sa keyboard.
Ang addEventListener () ay isang inbuilt Pag-andar ng JavaScript na kukuha ng kaganapan upang pakinggan, at isang pangalawang pagtatalo na tatawagan tuwing natanggal ang inilarawan na kaganapan. Ang anumang bilang ng mga handler ng kaganapan ay maaaring idagdag sa isang solong elemento nang hindi na-o-overtake ang mga umiiral na mga handler ng kaganapan.
addEventListener () sa JavaScript
Ilan sa mga mga tampok ng pamamaraan ng tagapakinig ng kaganapan kasama ang:
- Ang addEventListener () ang pamamaraan ay nakakabit ng an handler ng kaganapan sa tinukoy na elemento.
- Ang pamamaraang ito ay nakakabit ng isang handler ng kaganapan sa isang elemento nang wala patungan mayroon nang mga handler ng kaganapan.
- Pwede kang magdagdag maraming handler ng kaganapan sa isang elemento.
- Maaari kang magdagdag ng maraming mga handler ng kaganapan ng parehong uri sa isa elemento , ibig sabihin, dalawang kaganapan na 'pag-click'.
- Ang mga tagapakinig ng kaganapan ay maaaring idagdag sa anumang HATOL object hindi lamang mga elemento ng HTML. ie ang object ng window.
- Ginagawa ito ng addEventListener () na pamamaraan mas madali upang makontrol kung paano ang reaksyon ng kaganapan sa pagbulwak.
Kapag ginagamit ang addEventListener () na pamamaraan, ang JavaScript ay nahiwalay mula sa markup, para sa mas mahusay na kakayahang mabasa at pinapayagan kang magdagdag ng mga tagapakinig ng kaganapan kahit na hindi mo makontrol ang markup ng HTML.
Gayundin, madali mong aalisin ang isang tagapakinig ng kaganapan sa pamamagitan ng paggamit ng alisin ang paraan ngEventListener () .
Syntax:
target.addEventListener (uri, tagapakinig [, mga pagpipilian]) target.addEventListener (uri, tagapakinig [, useCapture]) target.addEventListener (uri, tagapakinig [, useCapture, naisUntrusted])
Mga Halaga ng Parameter
| Parameter | Paglalarawan |
pangyayari | Kailangan. Isang string na tumutukoy sa pangalan ng kaganapan. Tandaan: Huwag gamitin ang 'on' na unlapi. Halimbawa, gumamit ng 'click' sa halip na 'onclick'. Para sa isang listahan ng lahat ng mga kaganapan sa HTML DOM, tingnan ang aming kumpletong Sanggunian ng Bagay sa Kaganapan ng HTML DOM. |
pagpapaandar | Kailangan. Tinutukoy ang pagpapaandar na tatakbo kapag nangyari ang kaganapan. Kapag nangyari ang kaganapan, ang isang object ng kaganapan ay naipasa sa pagpapaandar bilang unang parameter. Ang uri ng kaganapan bagay nakasalalay sa tinukoy na kaganapan. Halimbawa, ang kaganapan na 'pag-click' ay kabilang sa object ng MouseEvent. |
useCapture | Opsyonal. Isang halaga ng Boolean na tumutukoy kung ang kaganapan ay dapat na ipatupad sa pagkuha o sa bubbling phase. Mga posibleng halaga: totoo - Ang handler ng kaganapan ay naisakatuparan sa pagkuha ng phasefalse- Default. Ang handler ng kaganapan ay naisakatuparan sa yugto ng pag-bubbling |
Ngayong alam mo kung paano gumagana ang isang tagapakinig ng kaganapan, tingnan natin ang isang halimbawa ng addEventListener () sa JavaScript.
addEventListener () sa JavaScript: Halimbawa
& lt! DOCTYPE html & gt & lthtml & gt & ltbody & gt & ltp & gtAng halimbawang ito ay gumagamit ng addEventListener () na pamamaraan upang magpatupad ng isang function kapag nag-click ang isang gumagamit sa isang pindutan. & lt / p & gt & ltbutton id = 'myBtn' & gtSubukan ito & lt / button & gt & lt & gt & amp; ('myBtn'). addEventListener ('click', myFunction) function myFunction () {document.getElementById ('demo'). innerHTML = 'Hello World'} & lt / script & gt & lt / body & gt & lt / html & gt 
Sa pamamagitan nito, natapos namin ang addEventListener na ito sa JavaScript. Inaasahan kong naunawaan mo kung paano ang tagapakinig ng kaganapan paraan gumagana sa JavaScript.
Suriin ang aming na kasama ng live na pagsasanay na pinamunuan ng magtuturo at karanasan sa proyekto sa totoong buhay. Ang pagsasanay na ito ay gumagawa sa iyo ng kasanayan sa mga kasanayan upang gumana sa back-end at front-end na mga teknolohiya sa web. Kabilang dito ang pagsasanay sa Pag-unlad sa Web, jQuery, Angular, NodeJS, ExpressJS, at MongoDB.
patakbuhin ang hive query mula sa linya ng utos
May tanong ba sa amin? Mangyaring banggitin ito sa seksyon ng mga komento ng blog na 'addEventListener in JavaScript' at babalikan ka namin.