Question

有没有办法检测连续的mousedown？换句话说，我希望在按下鼠标左键的同时继续运行一个功能。这是我试图做的一个例子。我有一个控制scrollLeft位置的按钮。每次点击都会增加20，但是我希望它在按下鼠标按钮的同时继续增量并停止onmouseup。

类似于按下鼠标按钮时滚动条上的箭头的工作方式

    var wrapperDiv = $("#wrapper-div");
    var scrollWidth = 0;

    $("#right-button").click(function() {
      if(scrollWidth < wrapperDiv[0].scrollWidth) {
        scrollWidth = scrollWidth+20;
        wrapperDiv.scrollLeft(scrollWidth);
      }

});

Answer 1

不要使用click处理程序。使用两个单独的处理程序，一个用于mousedown，另一个用于mouseup。

var $wrapper = $('#wrapper');

function startScrolling()
{
    // contintually increase scroll position
    $wrapper.animate({scrollLeft: '+=20'}, startScrolling);
}

function stopScrolling()
{
    // stop increasing scroll position
    $wrapper.stop();
}

$('#right-button').mousedown(startScrolling).mouseup(stopScrolling);

演示：http://jsfiddle.net/mattball/dkWGy/

Answer 2

如何使用mouseup和mousedown？

Answer 3

你应该为事件mousedown和mouseup使用参数

当鼠标按下为true时，您可以在JS中执行setInterval并执行您的操作。

当mouseup为true时，您可以认为他不再单击鼠标

Answer 4

这是相同的，但扩展为玩家UI 我发现我需要添加mouseleave以避免非检测。

var $wrapper = $('#main');

$('.pageBackOpt32').mousedown(scrollSlowL).mouseup(stopScroll).mouseleave(stopScroll);
$('.pageNextOpt32').mousedown(scrollSlowR).mouseup(stopScroll).mouseleave(stopScroll);
$('.pageRwOpt32').mousedown(scrollFastL).mouseup(stopScroll).mouseleave(stopScroll);        $('.pageFfOpt32').mousedown(scrollFastR).mouseup(stopScroll).mouseleave(stopScroll);

function scrollSlowL() { 
  $wrapper.animate({ scrollLeft: '-=50' }, scrollSlowL); 
}

function scrollSlowR() { 
  $wrapper.animate({ scrollLeft: '+=50' }, scrollSlowR); 
}

function scrollFastL() { 
  $wrapper.animate({ scrollLeft: '-=250' }, scrollFastL); 
}

function scrollFastR() { 
  $wrapper.animate({ scrollLeft: '+=250' }, scrollFastR); 
}

function stopScroll() {
  $wrapper.stop();
}

jQuery检测持续的mousedown

4 个答案:

演示：http://jsfiddle.net/mattball/dkWGy/