jQuery | evento.que propiedad con Ejemplos

El event.que es una propiedad incorporada en jQuery que se usa para devolver qué tecla del teclado o botón del mouse se presionó para el evento.
Sintaxis:

event.which

Parámetro: No acepta ningún parámetro porque es una propiedad no una función.
Valor de retorno: Devuelve qué tecla del teclado o botón del mouse se presionó.

código jQuery para mostrar el funcionamiento de esta propiedad:

Código #1:
En el siguiente código, se muestra el valor ascii de la clave.

<html>
  
<head>
    <script src="https://code.jquery.com/jquery-1.10.2.js">
    </script>
    <script>
        $(document).ready(function() {
            <!-- jQuery code to show event.which property -->
            $("input").keydown(function(event) {
                $("div").html("Key: " + event.which);
            });
        });
    </script>
    <style>
        div {
            margin: 20px;
            width: 80px;
            height: 60px;
            padding: 20px;
            border: 2px solid green;
        }
    </style>
</head>
  
<body>
    <!-- Here ascii value of the key will be shown -->
    <div>
        <p></p>
    </div>
    Name :
    <input type="text">
</body>
  
</html>

Salida:
Se muestra el valor ASCII de «G»

. Código n.º 2:
En el código siguiente, se muestra qué botón del mouse se presionó.

<html>
  
<head>
    <script 
    src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>
    <script>
        <!-- jQuery code to show event.which property -->
        $(document).ready(function() {
            $("div").mousedown(function(event) {
                $("div").append("<br>Mouse button : " + event.which);
            });
        });
    </script>
    <style>
        div {
            border: 2px solid green;
            width: 400px;
            height: 300px;
            padding: 20px;
        }
    </style>
</head>
  
<body>
    <!-- click inside and see -->
    <div style="">Click anywhere in this box !!!</div>
</body>
  
</html>

Salida:
cuando se hace clic en el botón izquierdo del mouse:

Publicación traducida automáticamente

Artículo escrito por kundankumarjha y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *