АКЦЫЯ: бясплатныя месячныя курсы па стварэнні сайтаў
на выбар: вёрстка, JavaScript, PHP, Python або фрэймворкі. Сёння апошні дзень для запісу! Націскай!
97 of 119 menu

Метад on

Метад on дазваляе дадаць апрацоўшчык падзей да элемента. Каб выдаліць апрацоўшчык можна скарыстацца метадам off, каб падзея спрацавала толькі адзін раз, а затым апрацоўшчык выдаліў сам сябе - скарыстайцеся метадам one. Элементы, да якіх мы прывязваем апрацоўшчык павінны існаваць падчас выкліку on.

Сінтаксіс

Так мы дадаем апрацоўшчык падзей да элемента, у якасці першага параметра ў выглядзе радка перадаецца адна ці некалькі падзей раздзеленых прабеламі, другім параметрам перадаем дадатковы фільтруючы селектар нашчадкаў унутры элемента, трэцім - дадатковыя даныя, якія перадаюцца ў апрацоўшчык у ўласцівасці event.data пры спрацоўванні падзеі. Другі і трэці парметры неабавязковыя. Чацвёртым перадаем функцыю-апрацоўшчык, у якую перадаецца аб'ект падзеі і неабавязковыя дадатковыя параметры. Калі замест функцыі-апрацоўшчыка перадаць false, то функцыя проста верне false:

$(селектар).on(падзеі, [селектар], [даныя], функцыя-апрацоўшчык(аб'ект падзеі, [дадатковыя параметры]));

Можна скарыстацца метадам on па-іншаму, тады ў першы параметр перадаецца аб'ект JavaScript, дзе ключы - тып падзеі, а значэнні - функцыі-апрацоўшчыкі, якія выклікаюцца для падзей:

$(селектар).on({'тып падзеі': handler}, [селектар], [даныя]);

Калі мы не перадаем дадатковы селектар, то падзея спрацоўвае на элеменце, да якога мы прымацоўваем апрацоўшчык, у адваротным выпадку - на элеменце-нашчадку, які які адпавядае гэтаму селектару (дэлегаваныя падзеі). Адзін і той жа апрацоўшчык падзеі можа быць прывязаны да элемента некалькі разоў.

Прыклад

Давайце ў alert, адлюструем тэкст абзаца з #test пры пстрычцы па ім, пстрычкі па іншых абзацах ні да чаго не прывядуць:

<p>text1</p> <p id="test">text2</p> <p>text3</p> $('#test').on('click', function() { alert( $(this).text() ); });

Прыклад

Давайце пры пстрычцы на абзац вывядзем даныя, якія мы перадалі ў метад on. Скарыстаемся функцыяй-апрацоўшчыкам testFunc, якую мы стварылі:

<p>click</p> function testFunc(event) { alert(event.data.text); } $('p').on('click', {text: 'aaa'}, testFunc);

Глядзіце таксама

  • метад off,
    які дазваляе выдаліць апрацоўшчык падзей у элемента
  • метад one,
    які дазваляе падзеі спрацаваць адзін раз, а затым аўтаматычна выдаліць апрацоўшчык
  • аб'ект event,
    які змяшчае інфармацыю аб падзеі
  • метад trigger,
    які дазваляе запусціць усе апрацоўшчыкі падзей, прывязаныя да элемента для падзей зададзенага тыпу
  • JavaScript метад bind,
    які дазваляе прывязаць кантэкст да функцыі
byenru