JavaScript: マウスボタンが押されているかどうかを確認しますか? 質問する

Question

に関してパックスの解決策: ユーザーが意図的または誤って複数のボタンをクリックした場合は機能しません。なぜ私がそれを知っているのかは聞かないでください :-(。

正しいコードは次のようになります。

var mouseDown = 0;
document.body.onmousedown = function() { 
  ++mouseDown;
}
document.body.onmouseup = function() {
  --mouseDown;
}

テストは次のようになります:

if(mouseDown){
  // crikey! isn't she a beauty?
}

どのボタンが押されたかを知りたい場合は、mouseDown をカウンターの配列にして、ボタンごとに個別にカウントする準備をしてください。

// let's pretend that a mouse doesn't have more than 9 buttons
var mouseDown = [0, 0, 0, 0, 0, 0, 0, 0, 0],
    mouseDownCount = 0;
document.body.onmousedown = function(evt) { 
  ++mouseDown[evt.button];
  ++mouseDownCount;
}
document.body.onmouseup = function(evt) {
  --mouseDown[evt.button];
  --mouseDownCount;
}

これで、どのボタンが押されたかを正確に確認できます。

if(mouseDownCount){
  // alright, let's lift the little bugger up!
  for(var i = 0; i < mouseDown.length; ++i){
    if(mouseDown[i]){
      // we found it right there!
    }
  }
}

ここで注意していただきたいのは、上記のコードは 0 から始まるボタン番号を渡す標準準拠のブラウザでのみ機能するということです。IE は現在押されているボタンのビットマスクを使用します。

0 は「何も押されていない」
左は1
右は2
真ん中は4
上記の任意の組み合わせ、例：左＋中央の場合は5

したがって、それに応じてコードを調整してください。これは演習として残しておきます。

覚えておいてください: IE は、「event」と呼ばれるグローバルイベントオブジェクトを使用します。

ちなみに、IE には、あなたのケースで役立つ機能があります。他のブラウザがマウスボタンイベント (onclick、onmousedown、onmouseup) に対してのみ「button」を送信するのに対し、IE は onmousemove とともに送信します。そのため、ボタンの状態を知る必要があるときに onmousemove のリッスンを開始し、evt.button を取得したらすぐに確認することができます。これで、どのマウスボタンが押されたかがわかります。

// for IE only!
document.body.onmousemove = function(){
  if(event.button){
    // aha! we caught a feisty little sheila!
  }
};

もちろん、彼女が死んだふりをして動かなければ何も得られません。

関連リンク:

アップデート#1: なぜ document.body スタイルのコードを引き継いだのかわかりません。イベントハンドラーをドキュメントに直接アタッチする方がよいでしょう。

Answer 1