Javascript MouseEvent which Property

JavaScript MouseEvent Button Property

Last Updated : 12 Jan, 2023

The MouseEvent button property is used to define the left or right-click events. When the mouse button is clicked then it returns an integer value which describes the left, right, or middle mouse button. Syntax:

event.button

Return Value: This event returns an integer value on mouse click events are:

0: It indicates the left mouse button.
1: It indicates the middle mouse button.
2: It indicates the right mouse button.

The onmousedown event: This event occurs when a user presses a mouse button over an element.

Example 1:

HTML

<h1 style="color:green"> 
    GeeksforGeeks 
</h1> 
<h2>Mouse click event</h2> 
<button onclick="click(event)">Click me</button> 
<p id="demo"></p> 
<script> 
    document.onmousedown = click 
      
    // click function called 
    function click(event) { 
          
        // Condition to disable left click 
        if (event.button == 0) { 
                document.getElementById("demo").innerHTML= "Left click not allowed" 
        } 
    } 
</script>

Output:

JavaScript MouseEvent Button Property

JavaScript MouseEvent Button Property

Example 2:

HTML

<h1 style="color:green"> 
    GeeksforGeeks 
</h1> 
<h2>Mouse click event</h2> 
<button onclick="click(event)">Click me</button> 
<p id="demo"></p> 
<script> 
    document.onmousedown = click 
      
    // click function called 
    function click(event) { 
          
        // Condition to disable left click 
        if (event.button == 2) { 
                document.getElementById("demo") 
                          .innerHTML = "Right click not allowed"; 
        } 
    } 
</script>

Output:

JavaScript MouseEvent Button Property

JavaScript MouseEvent Button Property

We have a complete list of Mouse Events, to check those please go through this HTML DOM MouseEvent article

Javascript MouseEvent which Property

N

Naman_Garg

Improve

Article Tags :

Similar Reads

JavaScript MouseEvent altKey Property

The mouseEvent altKey property is used to define whether the alt key is pressed or not. It is a boolean value. When the alt key is pressed then on click of the mouse buttons it returns true and if it is not pressed then it returns false. Syntax: event.altKey Return Value: It returns a boolean value

JavaScript MouseEvent ctrlKey Property

The mouseEvent ctrlKey property is used to define whether the ctrl key is pressed or not. It is a boolean value. When the ctrl key is pressed then on click of the mouse buttons it returns true and if it is not pressed then it returns false. Syntax: event.ctrlKey Return Value: It returns a boolean va

Javascript MouseEvent which Property

The mouse event which property is used to return a number that corresponds to the pressed mouse button when a mouse event is triggered Syntax: event.which Return value: It returns a number indicating which mouse button is pressed: For left mouse button: 1 is returnedFor middle mouse button: 2 is ret

JavaScript MouseEvent shiftKey Property

The mouseEvent shiftKey property is used to define whether the shift key is pressed or not. It is a boolean value. When the shift key is pressed then on click of the mouse left button, it returns true and if the shift key is not pressed then it returns false. Syntax: event.shiftKey Return Value: It

HTML | DOM MouseEvent buttons Property

The buttons property of mouse event is used to return a number. The number indicates which mouse button or mouse buttons were pressed when a mouse event was triggered. This property is usually used along with the onmousedown event. This property is read-only. Due to lack of browser support, you may

JavaScript contextmenu MouseEvent

When we click the right mouse button on our desktop, a menu-like box appears and this box is called the context menu. In JavaScript, a context menu event runs when a user tries to open a context menu. This can be done by clicking the right mouse button. This article demonstrates executing any operat

JavaScript Cursor Property

Style.cursor specifies the mouse cursor to be displayed when pointing over an element. Syntax:object.style.cursor = "cursorValue";Some important mouse pointers are as follows: waithelpmovepointercrosshaircellnoneExample 1: This example shows the use of the JavaScript cursor property. [GFGTABS] HTML

HTML | DOM MouseEvent clientY Property

The MouseEvent clientY property is a read-only property which is used to return the vertical coordinate of the mouse pointer based on the current window when a mouse event was triggered. Syntax : event.clientY Return Value: It returns a number that represents the vertical coordinate of the mouse poi

HTML DOM MouseEvent clientX Property

The mouse event clientX property returns the horizontal coordinate (X-axis) of the mouse pointer in relation to the viewport when a mouse event occurs. It captures the mouse's position without considering any scroll offset. Syntax:event.clientXReturn Value: clientX returns the mouse pointer's X-coor

HTML DOM MouseEvent pageY Property

The MouseEvent pageY property is a read-only property and used for returning the vertical coordinate of the mouse pointer when an event has triggered. Syntax :event.pageYReturn Value: It returns a number which represents the vertical coordinate of the mouse pointer in pixels. Below program illustrat