问题
I do not understand why the returning value for mouse coordinate clientX in event drag is always 0 or a negative value just before releasing the mouse.
I have prepare an example, when user dragstart, mouse position is correct, same for end dragend... but if you look at the console for drag you will see before dragend a negative value.
Is a normal behavior? Why? I need to avoid this 0 value. any solutions?
http://jsfiddle.net/gg8gLpg0/
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style>
#test {
position: absolute;
width: 100px;
height: 100px;
background-color:red;
}
</style>
</head>
<body>
<div id="test" draggable="true">test</div>
<script>
var elm = document.getElementById('test');
elm.addEventListener('drag', function (event) {
//console.log(event.clientX);
//console.log(event.clientY);
}.bind(this));
elm.addEventListener('dragstart', function (event) {
console.log('start');
console.log(event.clientX);
console.log(event.clientY);
}.bind(this));
elm.addEventListener('drag', function (event) {
console.log('during drag');// PROBLEM HERE
console.log(event.clientX);
console.log(event.clientY);
}.bind(this));
elm.addEventListener('dragend', function (event) {
console.log('end');
console.log(event.clientX);
console.log(event.clientY);
}.bind(this));
</script>
</body>
</html>
回答1:
In my tests on Firefox the drag element ONLY fires a 0. AND, the drag event stopped the "mousemove" event from reaching the document level to capture it that way.
jsfiddle.net/qgedt70a/
Mozilla's official docs say the clientX is local for dragged objects and screenX is global coordinates, however both return 0 from the drag event in variations of my tests at the above jsfiddle.
Could be a bug. OR, I'm curious if they have disabled it for some strange security scenario?
来源：https://stackoverflow.com/questions/27156129/understanding-html-5-event-drag