Wie kann ich Javascript Timing auf Maus Stopp steuern und auf Mausbewegungsereignisse

Question

So habe ich eine Kontrolle (eine Karte) auf einer aspx Seite. Ich möchte einige Javascript schreiben Setup folgendes onload:

1. , wenn die Maus stoppt auf Kontrolle = einige Code

2. , wenn die Maus bewegt = einige Code (aber nur, wenn der Zug länger als 250 mil sec)

Das funktioniert Code auf Stopp auslösen und dann auf zu bewegen ...

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);
    };
    })();
};

Aber ich kann nicht herausfinden, wie eine Verzögerung in die auf Bewegung Code einzuführen. Ich dachte, ich es mit diesem hatte ...

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);
    };
    })();
};

Aber es ist nicht so verhalten, wie ich dachte, es würde. Der auf Zug „thread2“ wird nie durch den Anschlag gelöscht. Was bin ich?

Answer 1

Das ist eine schwierige Sache. Ein wenig Bastelei in dieser Folge:

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
    };

  })();

};

Der Grund, Ihr Code nicht funktioniert, ist, dass mousemove- Feuer wiederholt, während die Maus bewegt wird, und Sie beginnen, neue Timeouts jedes Mal.