MouseEvent.button

読み取り専用プロパティ MouseEvent.button はイベントのトリガーとなったのがどのボタンが押されたのかを表します。

このプロパティは押下から開放のイベントが発生したトリガーとなったボタンを保証するのみです。したがってそれ自体は、 mouseenter, mouseleave, mouseover, mouseout または mousemove のようなイベントでは保証されません。

ユーザーはポインティングデバイスの設定を変更できるため、例えばイベントのボタンプロパティがゼロだった場合、必ずしも物理的な左ボタンによるものとは限りません。ただし、そのような場合でも標準設定における左ボタンと同じ動作をするべきです。

構文

var buttonPressed = instanceOfMouseEvent.button

戻り値

該当するボタンに対応する番号:

• 0: メインボタンが押された。通常は左ボタンか未初期化状態。
• 1: 補助ボタンが押された。通常はホイールボタンまたは中央のボタンが押された場合。
• 2: 第二ボタンが押された。通常は右ボタン。
• 3: 第四ボタン。一般的にブラウザーの戻るボタン。
• 4: 第五ボタン。一般的にブラウザーの進むボタン。

マウスを左利き用に設定している場合、ボタン動作は反転します。この場合、値は右から左へ読み取られます。

例

<script>
var whichButton = function (e) {
    // 複数のイベントモデルに対応させる
    var e = e || window.event;
    var btnCode;

    if ('object' === typeof e) {
        btnCode = e.button;

        switch (btnCode) {
            case 0:
                console.log('左ボタンがクリックされた。');
            break;

            case 1:
                console.log('中央ボタンがクリックされた。');
            break;

            case 2:
                console.log('右ボタンがクリックされた。');
            break;

            default:
                console.log('想定外コード: ' + btnCode);
        }
    }
}
</script>

<button onmouseup="whichButton(event);" oncontextmenu="event.preventDefault();">マウスでクリック...</button>

仕様

ブラウザ実装状況

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

[1] This convention is not followed in Internet Explorer prior to version 9: see QuirksMode for details.

関連情報

• "MouseEvent"