Entlistener () - API уеб интерфейс, MDN

EventTarget.addEventListener () метод регистрира специфичен манипулатор събитие причинени EventTarget.

Забележка: За събитието слушателите, свързани с целта на събитието; събитието е в целевата фаза, отколкото улавяне и кипял фази. Събития в мишена фаза ще задействат всички слушатели на елемент, независимо от параметъра useCapture.







Забележка: useCapture стана по избор само в по-новите версии на най-големите браузъри; например, че не е по желание преди Firefox 6. Трябва да предоставите този параметър за широкия съвместимост.

wantsUntrusted Ако е вярно. слушателя ще получите генерираните събития, изпратени от една страница (по подразбиране е лъжа към хром и важи и за редовните уеб страници). Тази опция е налична само в Gecko и е най-вече полезни за употреба в добавки и самия браузър. Вижте Взаимодействие между привилегированите и непривилегированите страници за примери.

Добавянето на прост слушател

HTML съдържание

В горния пример, modifyText () регистрира слушател събитие за клик, използвайки addEventListener (). Кликнете някъде в таблицата ще повиши манипулатор и стартирате modifyText ().

Ако имате нужда да предавате параметри на слушателя, можете да използвате анонимен функция.

слушател събитие от анонимен функция

HTML съдържание

Защо да използваме addEventListener?

addEventListener - е начин да се регистрира събитието манипулатор, както е описано в документацията на W3C DOM. Ето списък на предимствата от тяхното ползване:

  • Тя ви позволява да добавите няколко работещи за едно и също събитие. Това е особено полезно за DHTML библиотеки или разширения на Mozilla. които трябва да работят в условия на използване на библиотеки на трети страни / разширения.
  • Тя осигурява точна фаза смяна на управление (повикване) манипулатора (улов или изкачване)
  • Пусната на всеки DOM елемент, не само на HTML елементи.

Добавянето на слушател по време на обработката събитие

Ако добавя към EventListener EventTarget по време на обработката събитие, то няма да бъде причинено от сегашните действия, но може да се задейства по-късен етап на обработка на събития в обработка на качване.

Множество слушателите идентични събития

Ако няколко идентични EventListener регистриран елементи на една EventTarget със същите параметри, дублира слушателите игнорирани. Те не позволяват да се нарече EventListener'u два пъти и тъй като същите ученици са игнорирани, няма нужда да ги премахнете ръчно, като използвате метод removeEventListener.

Тази стойност на продукцията

Желателно е да се прехвърлят член на която натоварване боравене със събития, например, като се използват общи манипулатори за подобни елементи. При добавяне на функция с помощта addEventListener () стойност на тази променлива се променя - имайте предвид, че тази стойност се предава на функция на обаждащия се.







В горния пример стойността на тази променлива в рамките modifyText () се обадете на събитие с едно щракване, когато равна на масата на "Т". Това е обратната поведението, което се случва, ако водачът се добавя към HTML-маркиране:

Стойността на тази променлива в рамките modifyText () наричаме с събитие клик е равен на глобалната връзката (прозорец) обект (или неопределен използване строг режим)

Пример свързват с и без:

Проблемът в примера по-горе е, че не можете да премахнете слушателя, причинени с обвързване. Друго решение използва специална функция handleEvent да прихване всеки случай:

Legacy Internet Explorer и attachEvent

В Internet Explorer под 9 версия, можете да използвате вместо стандартната attachEvent addEventListener. Подкрепа за IE, примера по-горе може да бъде променен, както следва:

В attachEvent има недостатък: това ще се отнася до прозореца на обект, а не елемент на което е бил призован.

съвместимост

Можете да заобиколят методите на addEventListener. removeEventListener. Event.preventDefault и Event.stopPropagation не се поддържа в IE 8 с помощта на следния код в скрипта nachaleVashego. Този код е в подкрепа на използването на handleEvent и събития DOMContentLoaded.

Старият начин на регистриране обработват събитие

addEventListener () се добавя 2 събития DOM спецификация. Преди това, на студентите се добавят, както следва:

Този метод замества настоящия случай слушател щракване. ако има такива. Същото важи и за други събития, свързани с тях и манипулатори като замъгляване (onblur), натискане на клавиш (onkeypress), и така нататък.

Тъй като тя е по същество част от DOM 0, този метод е широко podderzhkui не изисква специален код, различни браузъри; по този начин, обикновено се използва за добавяне на слушателите динамично освен ако не искате разширени функции addEventListener ().

въпроси памет

В първия случай, нова функция (анонимен) е създаден за всяка стъпка цикъл. Във втория случай, една предшестваща функция се използва като манипулатор събитие. От това следва, по-малка памет отпечатък. Освен това, в първия случай, поради липсата на препратки към анонимни функции, не можете да се обадите element.removeEventListener. защото няма връзка с манипулатор това време, тъй като в случай на Stora може да причини myElement.removeEventListener ( "клик", processEvent, невярно).

съвместимост

Бележки Gecko

  • Преди Firefox 6, браузърът ще хвърли изключение, ако параметъра useCapture не е точно равен на лъжа. Преди Gecko 9.0 (Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6), addEventListener () ще се хвърли изключение, ако параметъра слушател е бил равен на нула; Сега приключване на метода без грешка, но не прави нищо.

Бележки за WebKit

Вижте също

спецификация

хартиени етикети и участници

Благодарим Ви! Моля, проверете вашата папка "Входящи", за да потвърдите абонамента.

Ако преди това не потвърди абонамента за бюлетина на Mozilla, може да се наложи да го направя. Моля, проверявайте електронната си поща или спам в пощенската си кутия, за да се види дали това не е писмо от нас.

Скрий се абонирате за бюлетина

Защо MDN изглежда по различен начин?

MDN променя, като се фокусира само върху документацията на уеб технологиите. Всички едно и също голямо съдържание, за да остане тук; ние променяме само визуални елементи и навигация за да ви помогне бързо да намерите документацията за уеб технологии.

Но не се притеснявайте, MDN и Mozilla все още са заедно. В действителност, ние се актуализира само дизайна на MDN многократно, за да се съобразят с новото лого и цветове Mozilla.

Прочетете повече за редизайн на този пост в нашия блог. Благодарим Ви, че използвате MDN!

Скрий съобщение за редизайн