Metoda on

Metoda on omogoča dodajanje obravnavalca dogodkov elementu. Za odstranitev obravnavalca lahko uporabite metodo off, da se dogodek sproži samo enkrat, nato pa se obravnavalec samodejno odstrani - uporabite metodo one. Elementi, na katere vežemo obravnavalec, morajo obstajati v času klica on.

Sintaksa

Tako dodamo obravnavalca dogodkov elementu, kot prvi parameter v obliki niza se posreduje en ali več dogodkov, ločenih s presledki, drugim parametrom posredujemo dodaten filtrijoč selektor potomcev znotraj elementa, tretjim - dodatne podatke, ki se posredujejo obravnavalcu v lastnosti event.data ob sprožitvi dogodka. Drugi in tretji parameter sta neobvezna. Četrti parameter je funkcija-obravnavalec, ki ji se posreduje objekt dogodka in neobvezni dodatni parametri. Če namesto funkcije-obravnavalca posredujemo false, bo funkcija preprosto vrnila false:

javascript$(selektor).on(dogodki, [selektor], [podatki], funkcija-obravnavalec(objekt dogodka, [dodatni parametri]));

Lahko uporabimo metodo on drugače, potem se v prvi parameter posreduje objekt JavaScript, kjer so ključi - tip dogodka, in vrednosti - funkcije-obravnavalci, ki jih kličemo za dogodke:

javascript$(selektor).on({'tip dogodka': handler}, [selektor], [podatki]);

Če ne posredujemo dodatnega selektorja, se dogodek sproži na elementu, na katerega pripnemo obravnavalca, sicer - na elementu-potomcu, ki ustreza temu selektorju (delegirani dogodki). Enak obravnavalec dogodka je lahko vezan na element večkrat.

Primer

Pokažimo v alert, besedilo odstavka z #test ob kliku nanj, kliki na druge odstavke ne bodo povzročili ničesar:

html<p>text1</p>
<p id="test">text2</p>
<p>text3</p>

javascript$('#test').on('click', function() {
  alert( $(this).text() );
});

Primer

Ob kliku na odstavek prikažimo podatke, ki smo jih posredovali metodi on. Uporabimo funkcijo-obravnavalec testFunc, ki smo jo ustvarili:

html<p>click</p>

javascriptfunction testFunc(event) {
  alert(event.data.text);
}

$('p').on('click', {text: 'aaa'}, testFunc);

Glej tudi