Sadržaj
Od verzije 1.7 jQueryja imamo metodu on () koja nam nudi sve potrebne funkcionalnosti za upravljanje događajima. Zahvaljujući ovoj metodi više nam nisu potrebni stari bind (), live () ili delegate (), ali niti zamućenje (), fokus (), klik (), hover () i drugi.
Baš kao što postoji on (), imamo njegovu suprotnost, off (), koja uklanja događaje dodijeljene on ().
Vidjet ćemo niz primjera za bolje razumijevanje on () metode.
Pretpostavimo da želimo izvršiti funkciju kada se pritisne gumb:
(function () {$ ('button'). click (function () {// kôd za izvršavanje});}) ();
Kao da bismo to tradicionalno učinili s click (). No, ako pogledamo jQuery kôd, vidjet ćemo da se zapravo događa da se poziva metoda on (), pa je najbrže učiniti:
(function () {$ ('button'). on ('click', function () {// kôd za izvršavanje});}) ();
Ovo je najizravniji put. Isto vrijedi i za druge metode kao što su change (), hover (), mouseenter (), itd … (zapravo hover () ono što radi je poziv mouseenter () i mouseleave () koji pak pozivaju metodu on ()
Pogledajmo jQuery. Ako preuzmemo verziju 1.7 ili noviju i pogledamo njezin kôd, vidjet ćemo sljedeće:
jQuery.each (("fokus zamućenja fokus u fokusu učitavanje promjena veličine pomicanje istovaranje klik dblclick premještanje miša pomicanje miša pomicanje miša pomicanje miša poprečnik miša promjena miša odaberi pošalji tipku za spuštanje tipka greška pri odabiru tipke kontekstni izbornik"). split (""), funkcija f (i, naziv) {// Rukuje povezivanjem događaja jQuery.fn [name] = function (data, fn) {if (fn == null) {fn = data; data = null;} vrati argumente.length -> 0? This.on (name, null, podaci, fn): this.trigger (ime);};
Odavde nas samo zanima da metode „zamućivanje, fokusiranje, fokusiranje, fokusiranje, učitavanje, mijenjanje veličine, pomicanje, istovaranje, klik, dblclick, premještanje mišem, pomicanje miša, pomicanje miša, prelazak mišem, odabir miša, unos miša, premještanje miša, promjena, odabir, submit, keydown, keypress, keyup, error and contextmenu "na kraju sve završava s" this.on (ime, null, podaci, fn) ".
bind (), live () i delegate ()
U prošlosti se također radilo:
(function () {$ ('button'). bind ('click', function () {// kôd za izvršavanje pri kliku na gumb});}) ();
Ili, ako želimo da događaj funkcionira čak i nakon dodavanja novih elemenata "gumba" u dokument, tada bismo koristili metodu live ():
(function () {$ ('button'). live ('click', function () {// kôd za izvršavanje kada se pritisne gumb});}) ();
Nakon toga, jQuery je uveo "delegate ()", što nam je omogućilo da dodijelimo događaj kontekstu. Na primjer, ako je gumb (ili će biti, ako se dodaje kasnije) unutar div s klasom "spremnik":
(function () {$ ('div.container'). delegate ('button', 'click', function () {// kôd za izvršavanje pri kliku na gumb});}) ();
Ali kao i kod prethodnih, oba bind (), live () ili delegate () sve što rade je da pozovu metodu on ().Je li vam se svidio i pomogao ovaj vodič?Autor možete nagraditi pritiskom na ovaj gumb kako biste mu dali pozitivan bod