Metoda on

Metoda on umožňuje přidat obsluhu událostí k elementu. Pro odstranění obsluhy lze použít metodu off, aby událost proběhla pouze jednou a poté se obsluha sama odstranila - použijte metodu one. Elementy, ke kterým připojujeme obsluhu, musí existovat v době volání on.

Syntaxe

Tímto způsobem přidáme obsluhu událostí k elementu, jako první parametr se ve formě řetězce předává jedna nebo více událostí oddělených mezerami, druhým parametrem předáváme doplňující filtr selektor potomků uvnitř elementu, třetím - doplňující data, která jsou předána do obsluhy ve vlastnosti event.data při spuštění události. Druhý a třetí parametr jsou volitelné. Čtvrtým předáváme funkci-obsluhu, do které se předává objekt události a volitelné doplňující parametry. Pokud místo funkce-obsluhy předáme false, pak funkce jednoduše vrátí false:

$(selektor).on(události, [selektor], [data], funkce-obsluha(objekt události, [doplňující parametry]));

Lze použít metodu on jiným způsobem, pak se do prvního parametru předává objekt JavaScriptu, kde klíče jsou typ události a hodnoty jsou funkce-obsluhy, volané pro události:

$(selektor).on({'typ události': handler}, [selektor], [data]);

Pokud nepředáváme doplňující selektor, pak se událost spustí na elementu, ke kterému připojujeme obsluhu, v opačném případě - na elementu-potomkovi, který odpovídá tomuuto selektoru (delegované události). Stejná obsluha události může být připojena k elementu vícekrát.

Příklad

Pojďme v alert, zobrazit text odstavce s #test při kliknutí na něj, kliknutí na jiné odstavce k ničemu nevedou:

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

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

Příklad

Pojďme při kliknutí na odstavec zobrazit data, která jsme předali do metody on. Použijeme funkci-obsluhu testFunc, kterou jsme vytvořili:

<p>click</p>

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

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

Viz také

metoda off,
která umožňuje odstranit obsluhu událostí u elementu
metoda one,
která umožňuje události proběhnout jednou, a poté automaticky odstranit obsluhu
objekt event,
který obsahuje informace o události
metoda trigger,
která umožňuje spustit všechny obsluhy událostí, připojené k elementu pro události daného typu
JavaScript metoda bind,
která umožňuje připojit kontext k funkci