在拖动过程中释放鼠标时忽略 JavaScript mouseUp 事件
JavaScript mouseUp event ignored when mouse is released during drag
我有一个在我的脚本中创建并附加到另一个<div>
的<div>
元素。我有:
coverElm.onmousedown = mouseDownEventHandeler;
document.onmouseup = mouseUpEventHandeler;
document.onmousemove = mouseMoveEventHandeler;
我已经定义了函数并且工作得很好,并跟踪鼠标是否按下并带有布尔mouseDown
.
问题 - 当按下鼠标并松开时,永远不会处理document.onmouseup
。我认为这是因为它拖拽了<div>
女巫只是几句文字。我也有这个问题没有文字。
所以我正在寻找一种防止这种奇怪的拖动行为的方法,或者让onmousedrag
查看鼠标是否按下的方法 - 不使用鼠标向上和鼠标向下方法
以下是我的函数:
function mouseUpEventHandeler(e) {
mouseDown = false;
}
function mouseDownEventHandeler(e) {
mouseDown = true;
}
function mouseMoveEventHandeler(e) {
if (mouseDown) {
coverElm.innerHTML ="<p>Mouse down and dragging</p>";
}
}
> 90% 的情况下,这是因为拖动的元素位于具有mouseup
事件侦听器的元素前面,因此下面的父元素永远不会获取事件。
通常,这可以通过使用addEventListener
而不是事件的内联形式来修复。解决此问题的另一种方法是为拖动的元素提供释放鼠标时的eventListener
。此外,只要元素开始拖动(通过 zIndex
属性),就可以将div
放在所有其他元素的前面。
编辑:我编写了一些概念验证代码:http://jsfiddle.net/2BkEM/5/
$j(divID).bind('dragstart', function (event) { event.preventDefault() });
谢谢大家
相关文章:
- 为什么不't Javascript对我的输入值进行了一些重新检查
- 创建一个类似链接的按钮,并通过Javascript函数打开一个新的弹出窗口
- 将函数的上下文应用于javascript变量
- 使用php或javascript从facebook相册URL中删除多余的部分
- 正在添加'X'按钮,在文本字段旁边使用javascript
- 如何在JavaScript中将字符串转换为函数引用
- 模糊事件的Javascript测试
- Javascript更改图标
- 如何将HTML id分配给元素,以及如何将JavaScript应用于元素
- 如何使用WCF服务和javascript表单post上传.doc文件
- javascript结合了数组和字典
- 这是什么 ==- javascript 运算符
- 从javascript创建一个列表
- javascript可拖动滑块,可在mouseUp上捕捉回中间位置
- 在拖动过程中释放鼠标时忽略 JavaScript mouseUp 事件
- Javascript全局变量在mouseup上总是未定义的
- 用标准javascript而不是jquery中的mousedown、mousemove和mouseup触摸事件句柄
- 将javascript mousedown/mouseup/mousemove/keypress监听器移植到移动设备时,
- JavaScript mouseup事件被触发多次在一次点击
- 在javascript上做mousedown和mouseup需要多长时间?