我有一个在我的脚本中创建并附加到另一个<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() });
谢谢大家