拖動時獲取鼠標位置（JS + HTML5）

Question

我目前正在實施一個小型演示應用程序，試圖讓我的頭繞着HTML5拖放。我現在想要做的是在用戶拖動時獲取光標的位置，但是我遇到了一些問題。

看起來，'mousemove'事件在拖動時沒有被觸發，這阻止了我找出鼠標的當前位置。我可以使用'drag'事件，但我無法弄清楚如何從'drag'事件對象獲取位置。

Answer 1

// JavaScript 

document.addEventListener("dragover", function(e){ 
    e = e || window.event; 
    var dragX = e.pageX, dragY = e.pageY; 

    console.log("X: "+dragX+" Y: "+dragY); 
}, false); 

// jQuery 

$("body").bind("dragover", function(e){ 
    var dragX = e.pageX, dragY = e.pageY; 

    console.log("X: "+dragX+" Y: "+dragY); 
}); 

可運行代碼下面片段：

​​

Answer 2

document.ondragover = function(evt) { 
    evt = evt || window.event; 
    var x = evt.pageX, 
     y = evt.pageY; 

    console.log(x, y); 
} 

jsFiddle。

如果你使用jQuery ...

$(document).on('dragover', function(evt) { 
    var x = evt.pageX, 
     y = evt.pageY; 

    console.log(x, y); 

});