mozilla
Your Search Results

    MouseEvent.button

    The MouseEvent.button read-only property indicates which button was pressed on the mouse to trigger the event.

    Users may change the configuration of buttons on their pointing device so that if an event's button property is zero, it may not have been caused by the button that is physically left–most on the pointing device; however, it should behave as if the left button was clicked in the standard button layout.

    Note: Do not confuse this property with the MouseEvent.buttons property.

    Syntax

    var buttonPressed = instanceOfMouseEvent.button
    

    Return value

    A number representing a given button:

    • -1: No button pressed
    • 0: Main button pressed, usually the left button
    • 1: Auxiliary button pressed, usually the wheel button or themiddle button (if present)
    • 2: Secondary button pressed, usually the right button
    • 3: Fourth button, typically the Browser Back button
    • 4: Fifth button, typically the Browser Forward button

    For a mouse configured for left-handed use, the button actions are reversed. In this case, the values are read from right to left.

    Example

    <script>
    var whichButton = function (e) {
        // Handle different event models
        var e = e || window.event;
        var btnCode;
    
        if ('object' === typeof e) {
            btnCode = e.button;
    
            switch (btnCode) {
                case 0:
                    alert('Left button clicked.');
                break;
                case 1:
                    alert('Middle button clicked.');
                break;
                case 2:
                    alert('Right button clicked.');
                break;
                default:
                    alert('Unexpected code: ' + btnCode);
            }
        }
    }
    </script>
    
    <button onmouseup="whichButton(event);" oncontextmenu="event.preventDefault();">Click with mouse...</button>

    Specifications

    Specification Status Comment
    Document Object Model (DOM) Level 3 Events Specification
    The definition of 'MouseEvent.button' in that specification.
    Working Draft Compared to Document Object Model (DOM) Level 2 Events Specification, the return value can be negative.
    Document Object Model (DOM) Level 2 Events Specification
    The definition of 'MouseEvent.button' in that specification.
    Recommendation Initial definition.

    Browser compatibility

    Feature Firefox (Gecko) Chrome Internet Explorer Opera Safari
    Basic support 1.0 (1.7 or earlier) 1.0 9.0 [1] (Yes) 423
    Feature Firefox Mobile (Gecko) Android IE Mobile Opera Mobile Safari Mobile
    Basic support ? ? ? ? ?

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

    See also

    Document Tags and Contributors

    Contributors to this page: amycb, teoli, zastrowm, cvrebert, Jeremie
    Last updated by: teoli,