ugrás a tartalomhoz

Javascript események sorrendje

karpati · 2008. Dec. 15. (H), 11.12
A következő dologban kérném a segítségeteket:

Adott egy autocomplet szerű beviteli input mező és a hozzátartozó suggest adatok divben azt szeretném, hogy amikor az input mező elveszti a focust (blur) akkor az eredménymező törlődjön a DOM –ból amikor pedig az eredmény mezőre kattintok jelenjen meg az input mezőre (onclick). A két művelet egyenként jól működik, de amikor a blur esemény és az onclick egyszerre van felcsatolva, akkor a blur esemény mindig előbb lefut, így az onclick már nem fut le. A kérdés, hogy tudom a blur eseménynek, feltételt adni, hogy csak akkor fusson le amikor a fokuszt elveszti az input mező, és nem az suggest mezőre kattintanak.
Az implementálás jQuery használatával történt.
‹ frame-k közötti kapcsolat Képek minősége ›
 ■
1

nem értem

gex · 2008. Dec. 15. (H), 12.07
hogyan következik be egyszerre a két esemény (onclick, onblur)? kód vagy link sokat segítene.
2

Esenények

karpati · 2008. Dec. 15. (H), 13.14
Szia a beviteli mezőre van kapcsolva a blur figyelője, amely meghívja bluring() metódust, amely eltávolítja a result div-et.

$($this).blur(function(event)
{
$.fn.fieldIO.bluring($this);
})

Az ajánlások egy div mezőben vannak <li> tagok között amelynek CSS osztálya .result_odd és .result_even. A clickResult() függvény a clickelt elemet beteszi a az input mezőbe és eltávolítja a result div-et.

$('.result_odd,.result_even').click(function($this)
{
$.fn.fieldIO.clickResult( $this);
}
);

Amikor mind két event handler fel van kapcsolva, akkor egy .result_odd vagy .result_even css osztályú elemre kattintásnál is, generálodik egy blur esemény mert a windows-ra átmegy a focus. A bluring() lefut és eltávolítja a result divet a tartalmával együtt. a második eseménykezelő már nem fut le mert a bluring eltávolította, amin dolgozhatna.

Sajnos járatlan vagyok még az JavaScriptben és az eseménykezelőkben, látom, hogy nem jó a kód de sajna nem tudom a helyes megoldást. A fenti megoldás biztos nem jó!
3

Timeout

Ajnasz · 2008. Dec. 15. (H), 14.24
Blurre tegyel egy timeoutot, hogy csak x ido utan tuntesse el a divet es a clicknel clearTimeouttal torold azt, mielott lefutna.

Valami ilyesmire gondolok:


var blurTimeout = 0;

$($this).blur(function(event)
{
  blurTimeout = setTimeout(function(){$.fn.fieldIO.bluring($this);}, 100);
});

$('.result_odd,.result_even').click(function($this)
{
  clearTimeout(blurTimeout);
  $.fn.fieldIO.clickResult( $this);
}
);
5

Timeout OK!!!

karpati · 2008. Dec. 15. (H), 15.48
Köszönöm!!!
Most már működik csak a késleltetést kellet megemelni 1000-re.
4

értem már

gex · 2008. Dec. 15. (H), 14.41
oké, így már világos, én egy divbe pakolnám az input mezőt az ajánlásokkal (css-ben olyasmi mint az inline popupok), és az egészet tartalmazó divre raknám a blur eseményt. a timeout nekem azért nem szimpatikus mert mindig lesz olyan akinek túl gyorsan tűnik el (van egy pár diszlexiás barátom).
6

Focus

karpati · 2008. Dec. 15. (H), 16.47
A javascript specifikáció szerint a div nem kerülhet fókuszba így a blur sincs értelmezve rajta. Úgyhogy szerintem a javaslatod nem müködk, de ezt ne vedd 100%-nak.
7

van onblur a divnél is, de

gex · 2008. Dec. 15. (H), 20.32
van onblur a divnél is, de amúgy az onmouseout-ra gondoltam. mindenesetre most átolvastam elölről az egész szálat és azt hiszem nem sokat tettem hozzá. inkább csináld úgy, ahogy Ajnasz javasolta. :)
8

Ok

karpati · 2008. Dec. 15. (H), 22.00
Köszi a helyreigazítást!
Én a SUN Client-Side JavaScript Guide dokumentumát néztem abból indultam ki. :-)
9

Gecko

Poetro · 2008. Dec. 15. (H), 22.06
Ha van is, a Gecko alapú böngészők sok elemre nem támogatják az eseményt, lásd:
https://developer.mozilla.org/En/DOM/Element.onBlur