jQuery wielokrotnie włącza uruchamianie, nawet w przypadku elementów TD, w których mysz nie unosiła się przez wymagany czas - jquery, jquery-hover

Mam ustawiony limit czasu dość długi, 888ms. I uważam, aby mój wskaźnik myszy nie zatrzymał się na więcej niż jednej komórce. Mysz bardzo krótko dotyka innych komórek po tym, jak zatrzymałem się nad komórką pośrodku stołu, a następnie szybko przesunąłem mysz po sąsiedniej komórki, aby wyjść poza granice tabeli. Ale mysz znajduje się na sąsiednich komórkach tylko przez chwilę.

Jednak dostaję alert dla każdej komórki myszydotyka wyjścia ze stołu. To tak, jakby po uruchomieniu limitu czasu dowolna komórka, której zdarzenie najechania kursorem myszy zostało uruchomione, jest traktowana tak, jakby została najechana przez pełne 888 ms.

Poniższy kod znajduje się w pętli each (), która odwiedza każdą z komórek w tabeli:

           cell$.hover(
function () {
var el = $(this);
var delayedFunction = window.setTimeout(function () {
$.data(el, "timerid", null);
alert("hovered" + el.attr("id"));
}, 888);
$.data(el, "timerid", delayedFunction);
},
function () {
var el = $(this);
var delayedFunction = $.data(el, "timerid");
if (delayedFunction != null) {
// Kill previously started timer
window.clearTimeout(delayedFunction);
}
}
);

Odpowiedzi:

To dlatego, że linie var el = $(this); zwracają nowe Obiekty jQuery za każdym razem, gdy są wywoływane, więc przechowujesz delayedFunction dla obiektu jQuery, który nie jest taki sam w obu funkcjach (będą one różne za każdym razem, gdy któraś z nich zostanie wywołana, chociaż przechowują ten sam obiekt DOM), więc zawsze otrzymujesz undefined w drugiej funkcji.

Możesz to unieważnić, ustanawiając limit czasu dla rzeczywistego obiektu DOM, aby dane zostały zachowane, jak poniżej:

$.data(el[0], "timerid", delayedFunction);//In your first function

I

var delayedFunction = $.data(el[0], "timerid");//In your second function