Мехурчетата на събития и улавянето на събития са най-използваните термини в JavaScript по време на потока на събитията. Това са двата начина за разпространение на събития в HTML DOM API. Тази статия за Мехурчене на събития и улавяне на събития в JavaScript ще опише подробно защо ги изискваме в в следната последователност:
Какво представлява бълбукането на събития в JavaScript?
Мехурченето на събития е терминът, на който хората трябва да се натъкнат, докато разработват уеб приложение или уеб страница . По принцип, Мехурченето на събития е техника, при която манипулаторите на събития се извикват, когато един елемент е вложен в друг елемент и трябва да бъде от същото събитие. Подобно е на капсулирането.
Мехурчетата на събития са само малка част от обработката на събития в JavaScript. За да го разберем по-добре, трябва да знаем за размножаването на събития и как то поддържа раздуване на събития.
Какво е разпространение на събития?
Разпространението на събития може да се сравни като родителски термин с балонче и събиране на събития като негово дете.Той е представен по следния начин:
Ако кликнете върху някое изображение, то не само ще генерира събитие за щракване, но ще продължи към родител „a“ и дядо „li“. По този начин се осъществява разпространението на функцията. Тук изображението се счита за дъщерно и това е целта на събитието, където се генерира кликването. Изображението заедно с предците му заедно образува клона в терминология на дърво. Клонът е важен, тъй като ние опознаваме пътя, по който се разпространява събитието.
как да прекратите java програмата -
Всеки от слушателите се извиква съответно с обект на събитие, който събира информация за събитието. Това разпространение е много важно, тъй като ние познаваме процеса на извикване на всички слушатели за даденото събитие. От снимката по-горе можем да забележим, че определянето на клона е статично. Всички модификации на дърво, възникващи по време на събитието, се игнорират. Тук разпространението е двупосочно, т.е. преминава от прозореца към целта на събитието и се връща обратно. Тук разпространението е категоризирано в три основни типа. Тези, които са:
- Фазата на улавяне: Преминаване от прозореца към целевата фаза на събитието.
- Целевата фаза: Това е целевата фаза.
- Фазата на балончета: От родителя на целевото събитие обратно до прозореца.
Какво е улавяне на събития?
В тази фаза се извикват слушателите за улавяне, чиято стойност е регистрирана като „true“. Написано е като:
el.addEventListener ('щракване', слушател, вярно)Тук стойността на слушателя е регистрирана като „вярна“, така че това събитие се улавя. Ако нямаше стойност, тогава стойността по подразбиране беше фалшива и събитието нямаше да бъде уловено. Така че в тази фаза това събитие, чиято стойност е вярна, само се ориентира от прозореца и се извиква и улавя.
След това в целевата фаза на събитието се извикват всички регистрирани слушатели, независимо от тяхното състояние на флага, което е вярно или невярно.
Използване на балончета и събиране на събития в JavaScript
Във фаза Bubbling се извиква само non-capturer, тоест събитията, които имат стойност на флага като „false“. Мехурчетата на събития и улавянето на събития са много полезни и важни в терминологията на DOM (Document Object Model).
el.addEventListener ('click', listener, false) // слушателят не улавя el.addEventListener ('click', listener) // слушателят не улавяГорният код показва работата на фазата на балончене и улавяне. Не всички събития отиват към целта на събитието. Някои от тях не се издуват. Тяхното пътуване спира след целевата фаза. Потокът от три събития е илюстриран на следната диаграма:
как да затворите Java приложение
Балонирането на събития не работи при всички видове събития, но слушателят трябва да притежава “. Балон ”Булево свойство на обекта на събитието. Някои от другите свойства включват:
- e.цел: който препраща към целта на събитието.
- e.currentTarget: това е режимът, в който са регистрирани текущите слушатели. Тук стойността е посочена с помощта на това ключова дума.
- e.eventPhase: Това е цяло число, което се отнася до други три ключови думи като Capturing_phase, Bubbling_phase, AT_Target фаза.
Работна процедура
Нека разгледаме по-отблизо горната илюстрация. Нека щракнем върху елемента „buttonOne” и веднага след това ще се задейства събитие. Обикновено събитието започва своето пътуване от корена, който е най-горният елемент на дървото. След това преминава след дървото целевото събитие, което е “buttonOne”. Ето как пътува:
има vs е java
Както е показано на фигурата, събитието си проправя път през DOM терминологиите, достигайки до целевото събитие в крайна сметка. След като събитието достигне целта си, то не приключва. Той продължава и продължава в рамките на DOM терминологиите, както е показано на снимката по-долу.
Точно както преди, всеки елемент по пътя на събитието, докато се движи нагоре, се уведомява за съществуването му. Докато продължава така, сигурно си мислите дали можем да спрем процеса или не. Е, отговорът на въпроса е Да, можем да спрем разпространението на събитието. Това става чрез извикване на “StopPropagation” метод на обекта на събитието.
window.addEventListener ('click', e => {e.stopPropagation ()}, true) window.addEventListener ('click', listener ('c1'), true) window.addEventListener ('click', listener ('c2 '), вярно) window.addEventListener (' щракване ', слушател (' b1 ')) window.addEventListener (' щракване ', слушател (' b2 '))Чрез прилагане на ключовата дума можем да спрем разпространението. Работи по този начин, когато прилагаме ключовата дума „ stopPropagation ” тогава всички събития под основните събития не се извикват и следователно те няма да бъдат извикани, както е споменато в частта от кода по-горе. Има още една ключова дума, известна като „ stopImmediatePropagation ”. Както подсказва името, незабавно спира производството на братя и сестри.
С това стигнахме до края на нашата статия. Надявам се, че сте разбрали какво е балонче и събиране на събития в JavaScript.
След като вече знаете за мехурчетата и събирането на събития в JavaScript, разгледайте от Edureka. Обучението за сертифициране на уеб разработки ще ви помогне да научите как да създавате впечатляващи уебсайтове с помощта на HTML5, CSS3, Twitter Bootstrap 3, jQuery и Google API и да го разположите в Amazon Simple Storage Service (S3).
Имате въпрос към нас? Моля, споменете го в раздела за коментари на „Събиране на събития и събиране на събития в JavaScript“ и ние ще се свържем с вас.