我不明白为什么在事件拖动中鼠标坐标clientX的返回值总是0或释放鼠标之前的负值。
我准备了一个例子,当用户dragstart
,鼠标位置正确,结束同样dragend
...但是如果你查看控制台drag
你会看到之前dragend
负值。
是正常行为吗?为什么?我需要避免这个 0 值。有什么解决办法吗?
http://jsfiddle.net/gg8gLpg0/ 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>
在我对 Firefox 的测试中,拖动元素仅触发 0。
并且,拖动事件阻止了“mousemove”事件到达文档级别以这种方式捕获它。
jsfiddle.net/qgedt70a/
Mozilla 的官方文档说 clientX 是拖动对象的本地坐标,而 screenX 是全局坐标,但是在上面 jsfiddle 的测试变体中,两者都从拖动事件返回 0。
可能是一个错误。或者,我很好奇他们是否在某些奇怪的安全场景中禁用了它?
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)