capture Mausposition auf setInterval () in Javascript

Question

Ich habe eine Funktion in Javascript, die ein div auf der Mausposition abhängig bewegen. Diese Funktion wird auf einem setInterval () Funktion eingestellt und ausgeführt jede Sekunde. Ich brauche die Mausposition wie folgt zu erfassen:

function mousemov() {
  document.getElementById("myDiv").style.left = Event.clientX; //don't work
}

window.onload = function() {
  setInterval("mousemov()",1000);
}

Ps: Ich kann das mousemove- Ereignis verwenden, da die Funktion ausgeführt werden muss, auch wenn die Maus angehalten wird,

.

Dank für das hilft!

Answer 1

Das einzige Mal, dass Sie das Ereignisobjekt zugreifen kann, ist während der Ausführung eines Event-Handlers. Also, was Sie tun müssen, ist ein OnMouseMove Ereignis auf dem Dokument erstellen und speichern Sie die Mauskoordinaten in einem global zugänglichen Objekt. Anschließend können Sie diese Werte von überall Zugriff auf andere in Ihrem Skript die Mausposition zu bestimmen.

Hier ist ein Beispiel (Sie nicht jQuery verwenden, so ist dies gerade DOM-Code):

document.onmousemove = function(e) {
    var event = e || window.event;
    window.mouseX = event.clientX;
    window.mouseY = event.clientY;
}

function mousemov() {
    document.getElementById("myDiv").style.left = window.mouseX;
}

window.onload = function() {
    setInterval(mousemov, 1000);
}

sollte ich die Notiz, dass clientX und clientY Sie berücksichtigen nicht scrollen. Sie müssen die Scroll-Offsets holen und sie an die zurückgegebenen Werte gelten.

Answer 2

gut, wenn Sie die Maus bewegt für das Dokument zu hören und seine Position speichern, dann, wann immer Sie wollen, zum Beispiel jede Sekunde in Ihrem Fall haben Sie die letzte registrierte Position des Mauszeigers.

Dies ist ein jquery Beispiel

$(document).ready(function()
 {
  $().mousemove(function(e)
   {
       window.mouseX = e.pageX;
       window.mouseY = e.pageY;
  });
});

und Ihre mousemove- Funktion wäre

function mousemov() { 
    document.getElementById("myDiv").style.left = window.mouseX;
}