'onmousedrag'事件js

Question

我有一些代码,每次onmouseclick工作,并在我相应设置时不断onmousemove.我正在寻找一种方法来结合两者(即像点击和拖动),我认为这将是一个简单的任务,但找不到任何简单的解释.我得到的最接近的是拖放教程.

在onmouseclick事件被触发时,我是否必须调用onmousemove事件？或者有什么非常简单的我完全忽视？

干杯

Answer 1

您可能只想使用这样的标志:http://jsfiddle.net/n3MeH/.

var isMouseDown = false;
document.onmousedown = function() { isMouseDown = true  };
document.onmouseup   = function() { isMouseDown = false };
document.onmousemove = function() { if(isMouseDown) { /* do drag things */ } };

Answer 2

如果您不想使用全局变量进行拖动，可以使用全局event.buttons变量来确定按下了哪个鼠标按钮。

我在 Chrome 和 Firefox 中测试了这段代码。

document.onmousemove = function(event) {
    if(event.buttons == 1) { //dragged with left mouse button
        //your code
    }

    if(event.buttons > 0) { //dragged with any mouse button
        //your code
    }
}

Answer 3

你可以尝试这样的事情：

var div = document.getElementById('ex');

div.onmousedown = function(){
    document.onmousemove = function(e){
        div.innerText = '('+e.pageX +', '+e.pageY+')';
    }
    document.onmouseup = function(e){
        div.innerText = 'Click Me!';
        document.onmousemove = function(){};
    }
}

它将文档的 mousemove 和 mouseup 事件绑定到 div mousedown 上。

http://jsfiddle.net/Paulpro/cSKq2/