W poniższym fragmencie chciałbym zadzwonić do funkcji change() tylko wtedy, gdy pozostałem w sposób ciągły przez div przez pewien okres czasu. Jeśli po prostu chrumieję nad div, chciałbym anulować połączenie do funkcji - przy użyciu clearTimeout.

Widzę, że ClearTimeout nie działa. Ktoś proszę mi pomóc. Z góry dziękuję.

Część jQuery:

       var obj=$('#aaa');

        var tt;
        obj.find('div').bind({
            mouseenter:function(e){
                var that = $(this)
                tt = setTimeout(function(){
                                    change(e,that)
                                },1000) // <-- time to wait before execution
            },
            mouseleave:function(e){
                clearTimeout(tt);
            }
        });

      function change(e,that){
        console.log(e)
        console.log(that)
      }

Część HTML:

  <div id='aaa'>
    <div><!--class a start-->
        <div>lkaiseulaweg</div>
        <div><!--class b start-->
            <div>ae</div>
            <div>dd</div>
        </div><!--class b end-->
    </div><!--class a end-->

    <div><!--class a start-->
        <i>numbers</i>
        <div><!--class b start-->
            <div>986</div>
            <div>345</div>
            <div>000</div>
            <div>999</div>
        </div><!--class b end-->

    </div><!--class a end-->
  </div>
1
maan81 2 listopad 2011, 15:51

5 odpowiedzi

Najlepsza odpowiedź

Potrzebujesz dodatkowego zamknięcia dla każdego DIV, dzięki czemu zmienna tt jest wyjątkowa. Użyj .each, aby powiązać słuchaczy zdarzeń, skutecznie tworząc nowe zamknięcie dla każdej zmiennej tt:

obj.find('div').each(function(){
    var tt;
    var that = $(this)
        that.bind({
        mouseenter:function(e){
            clearTimeout(tt); // In case something weird happens
            tt = setTimeout(function(){
                                change(e,that)
                            },1000) // <-- time to wait before execution
        },
        mouseleave:function(e){
            clearTimeout(tt);
        }
    });
});
2
Rob W 2 listopad 2011, 12:14

Spróbuj unosić zamiar, który dodaje opóźnienia http://cherne.net/brian/rosources/jquery.Hoveryntent .html.

1
epascarello 2 listopad 2011, 12:20

Musisz mieć div z ID = 'AAA "niektóre gdzie w twoim HTML

<div id='aaa'><!--class a start-->
        <div>lkaiseulaweg</div>
        <div><!--class b start-->
            <div>ae</div>
            <div>dd</div>
        </div><!--class b end-->
    </div><!--class a end-->

    <div><!--class a start-->
        <i>numbers</i>
        <div><!--class b start-->
            <div>986</div>
            <div>345</div>
            <div>000</div>
            <div>999</div>
        </div><!--class b end-->

    </div><!--class a end-->

Zobacz JSFiddle tutaj http://jsfiddle.net/vr5hj/

0
Jayantha Lal Sirisena 2 listopad 2011, 12:05

Nie działa, ponieważ ustawiasz wiele limitu czasu i przechowywać je w tej samej zmiennej, więc pierwszy, który ustawiony zostanie nadpisany przez następny i tak dalej. Możesz to sprawdzić, usuwając wszystkie divs wewnątrz #aaa z wyjątkiem jednego i zobacz, że działa dobrze.

Co musisz zrobić, to oczyścić stary limit czasu, zanim go ustawisz:

            var that = $(this);
            if(tt) clearTimeout(tt);
            tt = setTimeout(function(){
                                change(e,that)
                            },1000) // <-- time to wait before execution
0
Tetaxa 2 listopad 2011, 12:08

Pierwszy post: tęsknisz za ";" Po var that = $(this)

Ok, wydaje się, że nie jest problem ... (ale JSFiddle nie ważny!)

Ale dla JSFiddle musisz zdefiniować funkcję change przed użyciem go. http://jsfiddle.net/bouillard/rtsfr/

-1
Benoît 2 listopad 2011, 12:37