Hirdetés
- Épkézlábnak tűnő, vezetékmentes, de olcsó billentyűzet jött a Redragontól
- Eldőlt, hogy lesz-e céges internetadó az EU-ban
- Októberben kerülnek legacy státuszba a régebbi GeForce VGA-k
- A konkurens hardvereken is működőképessé tette az XeSS 2-t az Intel
- Rengeteg monitor kapott G-Sync Compatible hitelesítést az új GeForce driverben
Hirdetés
Talpon vagyunk, köszönjük a sok biztatást! Ha segíteni szeretnél, boldogan ajánljuk Előfizetéseinket!
-
PROHARDVER!
JavaScript != Java (A JavaScript nem összekeverendő a Javával, két különböző programozási nyelvről van szó!)
Új hozzászólás Aktív témák
-
Jim-Y
veterán
válasz
kemkriszt98 #4248 üzenetére
Szia. Én nem értek túlságosan a jQuery-hez, de még a tanulásod elején megemlíteném, hogy érdemes 1-2 good-practice-t betartani.
Az egyik ilyen, hogy kerüljük a this használatát. Amikor csak lehet használjunk mást. A példádban is lehetett volna mást használni, és ennek nem csak az az előnye, hogy olvashatóbb, és érthetőbb lesz a kód, vannak olyan helyzetek, amikor rossz működésre vezet a this használata.
Demo (rossz eset, amikor a példád hibázna, nem várt eredményre jutna):
http://jsfiddle.net/Jim_Y/tsucL8je/18/
Mi történt?
- két divet ágyaztunk egymásba. jQuery-vel egy eseménykezelőt állítunk a div-re, és azt várnánk, hogy amelyik kockára kattintunk, az majd 100px-el lejjebb kerül. Nem ez történik!
- ad1: propagation, a selector nem egy, hanem 2 elemet is "matchel", először azon fut le az eseménykezelő amire ténylegesen kattintottál, tehát a .inner, majd propagál és a .outer div-en is le fog futni az eseménykezelő.
- ad2: a this mindig az aktuálisan "propagált" elemre mutat. Tehát az első loop-ban a this a .inner, majd a következőben a this a .outerEmiatt mindkét div lejjebb fog kerülni, talán 100px-nél nem is olyan feltűnő, de egy kattintásra az a div amin eredetileg kattintottunk (.inner) összesen 200px-el csúszott lejjebb.
Megoldás vol1:
Cseréljük le a this-t, ahogy eredetileg is javasoltam event.target-re.
http://jsfiddle.net/Jim_Y/tsucL8je/19/
Mi történt?
- még mindig furcsán működik, még mindig nem azt tapasztaljuk amit szerettünk volna, most egy kattintásra a .inner kocka 2x100px-el lejjebb került.
Ez azért van, mert az event.target minden loopban ugyanaz, arra mutat amelyik elemre kattintottunk az egérrel. (megjegyzés: az event.currentTarget minden esetben === this)
Első ciklusban event.target -et eltoltuk 100px-el, majd jön a második ciklus (propagation ugyebár, vagy bubbling effect, ki hogy ismeri) ahol ugyancsak event-targetet toltuk el 100px-el.
Megoldás vol2:
http://jsfiddle.net/Jim_Y/tsucL8je/20/
Mi történt?
- itt már szinte az történik amire számítottunk, amire kattintunk az 100px-el lejjebb kerül és nincs propagation. Persze ha a .outer div-re kattintunk akkor az inner is lejjebb kerül, ez annak a következménye, hogy az inner az outeren belül van foglalva. Ezen nem tudunk segíteni, csak ha máshogy írjuk meg a html-t.
Összefoglalva:
* event.target statikus, mindig arra mutat amire ténylegesen kattintottunk (vagy általánosabban fogalmazva, amelyik node-on az esemény létrejött)
* this az változik, illetve sok esetben nem lehet megmondani, hogy most éppen mire is mutat a this, jobb ezt elkerülni.
* event propagation. Ezt is figyelembe kell venni bizonyos esetekben.Üdv
Új hozzászólás Aktív témák
- Telekom otthoni szolgáltatások (TV, internet, telefon)
- PROHARDVER! feedback: bugok, problémák, ötletek
- Elektromos cigaretta 🔞
- sziku69: Szólánc.
- PlayStation 1 / 2
- Luck Dragon: Asszociációs játék. :)
- Milyen Android TV boxot vegyek?
- sziku69: Fűzzük össze a szavakat :)
- Nők, nőügyek (18+)
- Hivatalos a OnePlus 13 startdátuma
- További aktív témák...
- GYÖNYÖRŰ iPhone 13 mini 128GB Blue -1 ÉV GARANCIA - Kártyafüggetlen, MS3045, 96% Akkumulátor
- HP 14 Elitebook 1040 G9 FHD+ IPS i5-1245U 10mag 16GB 512GB 5G Modem Intel Iris XE Win11 Pro Garancia
- Telefon felvásárlás!! iPhone 12 Mini/iPhone 12/iPhone 12 Pro/iPhone 12 Pro Max
- Telefon felvásárlás!! Xiaomi Redmi 9, Xiaomi Redmi 9AT, Xiaomi Redmi 10, Xiaomi Redmi 10 2022
- Samsung Galaxy Tab A8 32GB, Újszerű, 1 Év Garanciával
Állásajánlatok
Cég: FOTC
Város: Budapest