Jquery mousedown + mousemove

Question

如何在JQuery中创建鼠标按下并移动时触发的事件？而且每次mousedown + mousemove只触发一次？

Answer 1

更新：

所以，看起来如果你的鼠标不再停留在onmouseup绑定的元素上，它将看不到鼠标向上事件。这是有道理的，但当mousedown事件发生在元素上时，作为UI用户，我们希望它知道它是什么时候释放的(即使它不在元素上)。

因此，为了解决这个问题，我们实际上在文档级别检测鼠标向上。

var clicking = false;

$('.selector').mousedown(function(){
    clicking = true;
    $('.clickstatus').text('mousedown');
});

$(document).mouseup(function(){
    clicking = false;
    $('.clickstatus').text('mouseup');
    $('.movestatus').text('click released, no more move event');
})

$('.selector').mousemove(function(){
    if(clicking == false) return;

    // Mouse click + moving logic here
    $('.movestatus').text('mouse moving');
});

我在jsbin上尝试了一下，它似乎起作用了。在这里查看：http://jsbin.com/icuso。要编辑它(参见JS和HTML)，只需在URL末尾添加" edit“标签。http://jsbin.com/icuso/edit。

Answer 2

使用以下代码

$(element).mousemove(function(e){
 if(e.which==1)
 {
   #do job
 }
});

更新:

对于某些浏览器，您可能需要使用以下代码：

$(element).mousemove(function(e){
 if(e.buttons==1)
 {
   #do job
 }
});

Answer 3

对于音频音量控制器，我执行了以下操作：

$('#control-vol').bind('mousedown', function(e){
    $('#control-vol').bind('mousemove', function(e){
        var volumen = e.pageX - this.offsetLeft;
        $('#barra-vol').width(volumen + 'px');
        $('audio')[7].volume = volumen/50;
    });

    $('#control-vol').bind('mouseup',function(){
        $('#control-vol').unbind('mousemove')
    });
});