jQuery esemény névtér

-

jQuery-ben nagyon könnyű eseményfigyelőket rendelnünk egy-egy elemhez és ugyanilyen könnyű eltávolítani őket! Mi a helyzet akkor, ha egyszerre több ugyanolyan figyelőt is beállítottunk? Hogyan távolítjuk el, csak a szükségeset?

Erre a problémára kínál megoldást a jQuery event namespace funkciója, melynek segítségével elszeparálhatjuk az ugyanolyan eseményfigyelőket. A névtér használata – a több, ugyanolyan eseményfigyelővel ellátott elemek esetében – általában csak akkor szükséges, ha valamilyen oknál fogva szeretnénk az egyik figyelőt törölni – ilyen ok lehet, hogy a továbbiakban nincs rá szükségünk, vagy csökkentenénk a memória használatot.

jQuery-ben ha szeretnénk eseményfigyelőt rögzíteni, vagy eltávolítani azt az .on() és az .off() függvényekkel tehetjük meg. A következőképpen rögzíthetünk két click eseményt egy elemhez:

$('#elem')
  .on('click', meghívandóFüggény)
  .on('click', másikMeghívandóFüggvény);

Ha az #elem azonosítóval rendelkező elemre kattintunk, úgy mind a két click esemény lefut! Nézzük mit kell tennünk, ha szeretnénk eltávolítani a beállított figyelőket:

$('#elem').off('click');

Egyszerűen meghívhatjuk az .off() függvényt az elemen, ami eltávolítja róla az összes click figyelőt! Ebben az esetben mi nem ezt szeretnénk, hanem azt, hogy csak az elsőt távolítsuk el! Ezt a következőképpen tehetjük meg:

$('#elem').off('click', meghívandóFüggvény);

Jól látható, hogy ugyanazt a struktúrát használtuk, mint az esemény rögzítésekor, így a jQuery már tudja, hogy melyik az a click esemény, amelyiket el kell távolítania! Mindez így rendben is van, hiszen eltudjuk távolítani csak azt a figyelőt, amire nincs szükségünk! De, jQuery-ben népszerűek a névtelen függvények, amennyiben azt használunk már nem tudjuk azonosítani az eseményfigyelőt egy függvény névvel:

$('#elem').on('click', function() {
   console.log('Hello!');
});

A fenti hívást már nem tudjuk ebben a formában azonosítani, itt jön képbe a már említett esemény névtér, melynek segítségével egyedivé tehetünk bármilyen eseményfigyelőt, méghozzá a következőképpen:

$('#elem').on('click.sajátNévtér', function() {
   console.log('Hello!');
});

Ettől a deklarálástól kezdve már a névtér segítségével hivatkozhatunk az .off() függvény hívásakor a szükséges figyelőre:

$('#elem').off('click.sajátNévtér');

Ennyi az egész, már el is távolítottuk a korábban rögzített figyelőt, úgy hogy nem bántottuk az esetlegesen rögzített továbbiakat!

Összefoglalás

Az esemény névtér egy nagyon apró hasznos része a jQuery-nek. Épp az ilyen hasznos apróságoktól lett ez a keretrendszer az, ami! Valószínű, hogy a mindennapokban nem lesz szükségünk erre a funkcióra, de egy kicsit komplikáltabb alkalmazás esetén könnyen előfordulhatnak a fenti lehetőségek, jó tudni, hogy könnyedén megoldhatjuk őket!

Kapcsolódó tartalom

Szolgáltatások

Full-stack webfejlesztés

01.

Egyedi weboldalt szeretnél?

WordPress CMS-el fejlesztve megvalósítjuk elképzeléseid. Készítünk egy modern oldalt, amivel felveheted a versenyt a konkurenciával.

02.

Komplex webes ötleted van?

Teljes körű alkalmazásfejlesztési szolgáltatást nyújtunk, amennyiben van egy olyan ötleted, vagy terved, ami nem valósítható meg kész megoldásokkal.