Įvykių burbuliavimas ir įvykių fiksavimas yra dažniausiai naudojami „JavaScript“ terminai įvykių eigos metu. Tai yra du įvykių sklaidos būdai HTML DOM API. Šiame straipsnyje apie „Event Bubbling“ ir „Event Capturing“ sistemoje „JavaScript“ bus išsamiai aprašyta, kodėl mes to reikalaujame tokia seka:
Kas yra „JavaScript“ renginių burbuliavimas?
Renginių burbuliavimas yra terminas, su kuriuo žmonės turi susidurti kurdami interneto programą ar tinklalapį . Iš esmės renginių burbuliavimas yra metodas, kai įvykių tvarkytojai kviečiami, kai vienas elementas yra įdėtas į kitą elementą ir turi būti to paties įvykio. Tai panašu į „Encapsulation“.
Renginių burbuliavimas yra tik nedidelė dalis „JavaScript“ įvykių tvarkymo. Kad geriau suprastume, turime žinoti apie renginių platinimą ir kaip jis palaiko renginių burbuliavimą.
Kas yra renginių platinimas?
Įvykių skleidimą galima palyginti kaip pirminį terminą su burbuliuojančiu ir užfiksuotu įvykiu.Tai vaizduojama taip:
Jei spustelėsite bet kurį vaizdą, jis ne tik sukurs paspaudimo įvykį, bet ir pereis prie tėvų „a“ ir senelio „li“. Tokiu būdu vyksta funkcijos sklidimas. Čia vaizdas laikomas vaiku ir tai yra įvykio tikslas, kur generuojamas paspaudimas. Vaizdas kartu su savo protėviais medžio terminologijoje sudaro šaką. Šaka yra svarbi, kai mes sužinome kelią, kuriuo eina renginys.
Kiekvienas iš klausytojų yra iškviestas su atitinkamu įvykio objektu, kuris renka informaciją apie įvykį. Ši sklaida yra labai svarbi, nes mes sužinome visų klausytojų iškvietimo procesą. Iš aukščiau esančio paveikslėlio galime pastebėti, kad šakos nustatymas yra statinis. Bet kokios medžio modifikacijos, įvykusios įvykio metu, nepaisomos. Čia sklaida yra dvikryptė, ty eina nuo lango iki įvykio tikslo ir grįžta. Čia dauginimas skirstomas į tris pagrindinius tipus. Jie yra:
„Salesforce“ kūrėjų pamoka pradedantiesiems
- Užfiksavimo etapas: Eikite iš lango į tikslinę įvykio fazę.
- Tikslinis etapas: Tai tikslinė fazė.
- Burbulo etapas: Nuo tikslinio įvykio tėvo atgal į langą.
Kas yra įvykių fiksavimas?
Šiame etape kviečiami klausytojai, kurių vertė užregistruota kaip „tikra“. Tai parašyta taip:
el.addEventListener („spustelėkite“, klausytojas, tiesa)
Čia klausytojo vertė buvo įregistruota kaip „teisinga“, todėl šis įvykis užfiksuojamas. Jei nebūtų vertės, reikšmė pagal numatytuosius nustatymus būtų klaidinga ir įvykis nebūtų užfiksuotas. Taigi šiame etape tas įvykis, kurio vertė yra tikra, randa kelią tik iš lango, jį pašaukia ir užfiksuoja.
Tuomet renginio tikslinėje fazėje visi užsiregistravę klausytojai kviečiami, neatsižvelgiant į jų teisingą ar melagingą vėliavos būseną.
Įvykių burbuliavimo ir įvykių fiksavimo naudojimas „JavaScript“
„Burbuliavimo“ fazėje vadinamas tik neužkertantis asmuo, ty įvykiai, kurių vėliavos vertė yra „klaidinga“. Įvykių burbuliavimas ir įvykių fiksavimas yra labai naudingi ir svarbūs DOM („Document Object Model“) terminologijoje.
el.addEventListener („spustelėkite“, klausytojas, klaidingas) // klausytojas nefiksuoja el.addEventListener („spustelėkite“, klausytojas) // klausytojas nefiksuoja
Virš kodo rodomas burbuliavimo ir fiksavimo etapas. Ne visi įvykiai nukreipiami į tikslą. Kai kurie iš jų neburbuliuoja. Jų kelionės sustoja po tikslinės fazės. Trijų įvykių fazių srautas pavaizduotas šioje diagramoje:
nustatyti java klasės kelią
Įvykių burbuliavimas neveikia visų tipų renginiuose, tačiau klausytojas turi tai turėti “.Burbulas „Boolean įvykio objekto ypatybė. Kai kurios kitos savybės apima:
- el. tikslas: kad nurodo įvykio tikslą.
- e.currentTarget: tai režimas, kuriuo registruojami dabartiniai klausytojai. Čia vertė nurodoma naudojant tai raktinis žodis.
- e.eventPhase: Tai yra sveikasis skaičius, nurodantis kitus tris raktinius žodžius, pvz „Capturing_phase“, „Bubbling_phase“, „AT_Target“ fazė.
Darbo tvarka
Pažvelkime atidžiau į aukščiau pateiktą iliustraciją. Spustelėkite elementą „buttonOne“, tada tuoj pat bus suaktyvintas įvykis. Paprastai įvykis pradeda savo kelią nuo šaknies, kuri yra aukščiausias medžio elementas. Tada jis eina paskui medį pagal tikslinį įvykį, kuris yra „buttonOne“. Štai kaip jis keliauja:
Kaip parodyta paveikslėlyje, įvykis patenka per DOM terminologiją, galų gale pasiekdamas tikslinį įvykį. Dabar, kai įvykis pasiekia tikslą, jis nesibaigia. Tai tęsiama ir tęsiama DOM terminologijose, kaip parodyta žemiau esančiame paveikslėlyje.
php print_r į eilutę
Kaip ir anksčiau, kiekvienam elementui, einančiam į viršų, pranešama apie jo egzistavimą. Vykstant šitam reikia galvoti, ar galime sustabdyti procesą, ar ne. Na, atsakymas į klausimą yra „Taip“, mes galime sustabdyti renginio sklaidą. Tai daroma iškviečiant „StopPropagation“ įvykio objekto metodas.
window.addEventListener ('click', e => {e.stopPropagation ()}, true) window.addEventListener ('click', klausytojas ('c1', true) window.addEventListener ('click', klausytojas ('c2 '), true) window.addEventListener (' click ', klausytojas (' b1 ')) window.addEventListener (' click ', klausytojas (' b2 '))Taikydami raktinį žodį, mes galime sustabdyti sklaidą. Tai veikia taip, kai naudojame raktinį žodį „ stopPropagation “ tada visi įvykiai pagal pagrindinius įvykius nėra iškviečiami ir todėl jie nebus vadinami, kaip minėta pirmiau pateiktame kodo fragmente. Yra dar vienas raktinis žodis, žinomas kaip „ stopImmediatePropagation “. Kaip rodo pavadinimas, jis nedelsdamas sustabdo brolių ir seserų procesą.
Tuo mes pasiekėme savo straipsnio pabaigą. Tikiuosi, kad supratote, kas yra „Java“ renginių burbuliavimas ir renginių fiksavimas.
Dabar, kai žinote apie „Event Bubbling“ ir „Event Capturing“ naudojimą „JavaScript“, patikrinkite pateikė Edureka. Žiniatinklio kūrimo sertifikavimo mokymai padės jums sužinoti, kaip sukurti įspūdingas svetaines naudojant HTML5, CSS3, „Twitter Bootstrap 3“, „jQuery“ ir „Google“ API ir pritaikyti ją „Amazon Simple Storage Service“ (S3).
Turite mums klausimą? Prašome tai paminėti komentarų skiltyje „Renginių burbuliavimas ir renginių fiksavimas„ JavaScript ““ ir mes su jumis susisieksime.