Jak korzystać z timingu javascript do kontrolowania zatrzymania myszy i zdarzeń przenoszenia myszy

Question

Mam kontrolę (mapę) na stronie aspx. Chcę napisać skrypt do onload konfiguracji następuje:

1. gdy myszy zatrzyma się na kontroli = jakiś kod

2. gdy mysz porusza = jakiś kod (ale tylko wtedy, gdy ruch jest dłuższy niż 250 mil s)

działa to wywołać kod na przystanku, a następnie przenieść ...

function setupmousemovement() { 
var map1 = document.getElementById('Map_Panel'); 
var map = document.getElementById('Map1'); 
map1.onmousemove = (function() { 
    var onmousestop = function() { 
      //code to do on stop 
    }, thread; 

    return function() { 
     //code to do on mouse move 
     clearTimeout(thread); 
     thread = setTimeout(onmousestop, 25); 
    }; 
    })(); 
}; 

Ale nie mogę wymyślić, jak wprowadzić opóźnienie w kodzie ruchu. Myślałem, że mam to z tym ...

function setupmousemovement() { 
var map1 = document.getElementById('Map_Panel'); 
var map = document.getElementById('Map1'); 
map1.onmousemove = (function() { 
    var onmousestop = function() { 
      //code to do on stop 
      clearTimeout(thread2); 
    }, thread; 

    return function() { 
     thread2 = setTimeout("code to do on mouse move", 250); 
     clearTimeout(thread); 
     thread = setTimeout(onmousestop, 25); 
    }; 
    })(); 
}; 

Ale nie zachowuje się tak, jak myślałem. W ruchu "thread2" nigdy nie jest usuwany przez stop. czego mi brakuje?

Answer 1

To jest trudne. Trochę majsterkowania spowodowało to:

function setupmousemovement() { 

    var map1 = document.getElementById('Map_Panel'); 
    map1.onmousemove = (function() { 
    var timer, 
     timer250, 
     onmousestop = function() { 

      // code to do on stop 

      clearTimeout(timer250); // I'm assuming we don't want this to happen if mouse stopped 
      timer = null; // this needs to be falsy next mousemove start 
     }; 
    return function() { 
     if (!timer) { 

     // code to do on start 

     timer250 = setTimeout(function() { // you can replace this with whatever 

      // code to do when 250 millis have passed 

     }, 250); 
     } 
     // we are still moving, or this is our first time here... 
     clearTimeout(timer); // remove active end timer 
     timer = setTimeout(onmousestop, 25); // delay the stopping action another 25 millis 
    }; 

    })(); 

}; 

Powodem Twój kod nie działa jest to, że mouseMove pożary wielokrotnie podczas gdy mysz porusza się i zaczynają nowe limity czasu za każdym razem.