one metódus
Az one metódus lehetővé teszi egy eseménykezelő
hozzáadását egy elemhez. Miután az esemény
egyszer aktiválódott - a kezelő automatikusan
eltávolításra kerül.
Szintaxis
Így rendelünk hozzá eseménykezelőt egy elemhez,
ahol az első paraméterként egy vagy több szóközzel elválasztott
eseményt adunk meg sztring formájában,
a másodikként - további adatokat adunk át JavaScript objektum formájában,
amelyek az eseménykezelőnek az event.data tulajdonságában
kerülnek továbbításra az esemény aktiválódásakor. A második paraméter
opcionális. A harmadikként átadjuk a kezelőfüggvényt,
amelynek az eseményobjektum kerül átadásra, vagy átadunk false-t:
$(selector).one(events, [data], handler(event object));
A második paraméterként átadhatunk egy további
szűrő szelektort az elem leszármazottjaihoz,
a harmadikként - további adatokat, amelyek az
eseménykezelőnek az event.data tulajdonságában
kerülnek továbbításra az esemény aktiválódásakor. A második és harmadik paraméterek
opcionálisak. A negyedikként adjuk át a
kezelőfüggvényt, amelynek az eseményobjektum
és opcionális további paraméterek kerülnek átadásra. Ha a
kezelőfüggvény helyett false-t adunk át, akkor a függvény egyszerűen
visszaad false-t:
$(selector).one(events, [selector], [data], handler(event object));
Használhatjuk az one metódust másképp is,
ekkor az első paraméterként egy
JavaScript objektumot adunk át, ahol a kulcsok - az eseménytípusok, az
értékek pedig - a kezelőfüggvények, amelyeket az
elemhez adtunk hozzá:
$(selector).one({'event type': handler}, [selector], [data]);
Ha nem adunk át további szelektort, akkor az esemény azon az elemen aktiválódik, amelyhez a kezelőt hozzárendeltük, ellenkező esetben - azon a leszármazott elemen, amely megfelel ennek a szelektornak (delegált események).
Példa
Kattintáskor a bekezdésen jelenítsük meg az adatokat, amelyeket
átadtunk az one metódusnak. A további kattintásokkor
semmi sem fog történni. Használjuk a
testFunc kezelőfüggvényt,
amelyet létrehoztunk:
<p>click</p>
function testFunc(event) {
alert(event.data.text);
}
$('p').one('click', {text: 'aaa' }, testFunc);