web-dev-qa-db-ja.com

スペースバーが押され、マウスがjQueryと同時に移動しているかどうかを確認しますか？

スペースバーを確認し、同時にマウスの移動方向と移動距離を追跡する方法はありますか？.

このことのポイントは、スペースバーと左マウスボタンを押しながらマウスを動かすと、Photoshopがどのようにスクロールするかを再現したいのですが、左マウスボタンを押し続ける必要はありません。

javascriptjqueryjavascript-events
20
Colin

keydown() と keyup() を使用して、スペースバーが押されているかどうかを追跡し、その状態をあなたの- mousemove() イベントハンドラ。例えば：

_var space = false;
$(function() {
  $(document).keyup(function(evt) {
    if (evt.keyCode == 32) {
      space = false;
    }
  }).keydown(function(evt) {
    if (evt.keyCode == 32) {
      space = true;
      console.log('space')
    }
  });
});
_

そして、あなたのmousemove()ハンドラーは、それが押されたかどうかを確認できます。

55
cletus

おそらく、keydownイベントを監視し、それがスペースバーであることを確認し、それがダウンしていることを示す変数を設定し、keyupイベントが表示されたら設定を解除する必要があります。

したがって、その変数が設定されているときに、スペースバーが押されたことを示すマウスの動きを探します。

4
John Boker

これは私の解決策です：

var allowed = true;
$(document).ready(
function () {
    $(document).bind('keydown', 'space', function () {
        if (!allowed) return;
        allowed = false;
        $('#viewport').
            dragscrollable();
    });
    $(document).bind('keyup', 'space', function () {
        allowed = true;
        $('#base').off('mousedown');
        return false;
    });

});

JQueryおよびDragscrollableプラグインで動作します。

3
vanLushi