jQuery se puede usar para distinguir en qué botón del mouse se está haciendo clic. Esto se puede usar en varias aplicaciones web en las que conocer un determinado botón del mouse se puede usar para activar cierta funcionalidad.
Usando el método mousedown():
El método mousedown() en jQuery se puede usar para vincular un controlador de eventos al evento predeterminado de JavaScript ‘mousedown’ . Esto se puede utilizar para desenstringr un evento. La propiedad ‘cuál’ del objeto de evento se puede usar para verificar el botón del mouse respectivo.
Sintaxis:
$( "#target" ).mousedown(function() {
alert( "Function to be handles here" );
});
Propiedad “cuál”:
La propiedad cuál tiene 3 valores dependiendo del botón del ratón presionado. Podemos usar un caso de interruptor para obtener el valor correspondiente.
- 1 para el botón izquierdo del ratón
- 2 para el botón central del mouse
- 3 para el botón derecho del ratón
Ejemplo:
<!DOCTYPE html>
<html lang="en">
<head>
<title>
How to distinguish left and right
mouse click using jQuery?
</title>
</head>
<body>
<h1 style="color: green">
GeeksforGeeks
</h1>
<b>
How to distinguish left and
right mouse click using jQuery?
</b>
<p>You are pressing the :
<div class="output">
</div>
<button>
Click Here to check the mousebutton pressed
</button>
<script src="https://code.jquery.com/jquery-3.3.1.min.js">
</script>
<script type="text/javascript">
$('button').mousedown(function(event) {
switch (event.which) {
case 1:
document.querySelector('.output').innerHTML =
'Left Mouse Button';
break;
case 2:
document.querySelector('.output').innerHTML =
'Middle Mouse Button';
break;
case 3:
document.querySelector('.output').innerHTML =
'Right Mouse Button';
break;
default:
break;
}
});
</script>
</body>
</html>
Salida:
Haciendo clic con el botón izquierdo del ratón:
Haciendo clic con el botón central del ratón:
Haciendo clic con el botón derecho del ratón:
Publicación traducida automáticamente
Artículo escrito por sayantanm19 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA