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
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
We have a complete list of Mouse Events, to check those please go through this HTML DOM MouseEvent article
Share your thoughts in the comments
Please Login to comment...