Por ejemplo, si queremos escuchar el click de todos los párrafos del documento podemos utilizar el siguiente código:

$('p').on('click', function() {

alert("Hiciste click sobre un párrafo");

});

Primero seleccionamos los elementos sobre los que queremos escuchar el evento con $(selector) (en el ejemplo utilizamos $('p') para seleccionar todos los párrafos).

El método on recibe el nombre del evento que queremos escuchar (en el ejemplo el evento click) y una función, que es la que se ejecuta cuando ocurre el evento. En esta función escribimos el código que queremos que se ejecute cada vez que que ocurra el evento.

A la función que recibe el método on se le llama un callback y puede recibir un argumento con información del evento. De esto hablaremos más adelante.

Nota: En algunos proyectos verás la siguiente forma de escuchar los eventos, que es equivalente a la anterior:

$('p').click(function() {

alert("Hiciste click sobre un párrafo");

});

Los eventos más comunes que puedes escuchar del mouse son los siguientes:

click

dblclick - doble click

mouseenter - se dispara cuando el mouse entra sobre alguno de los elementos seleccionados.

mouseleave - se dispara cuando el mouse sale de alguno de los elementos seleccionados.

mouseover - se dispara cuando el mouse entra o sale de alguno de los elementos seleccionados.

mousemove - se dispara cuando el mouse se mueve dentro de alguno de los elementos seleccionados.

La función que le pasamos al método on recibe un argumento con información del evento. Por ejemplo, a través de este objeto podemos obtener la posición del mouse cada vez que se mueve:

$(document).on('mousemove', function(e) {

 console.log("El mouse se encuentra en las coordenadas:" + e.pageX + ", " + e.pageY);

});

Existen tres eventos que puedes escuchar del teclado:

keydown - se dispara cuando oprimes una tecla.

keypress - similar a keydown pero no aplica para teclas como Shift, Esc, Alt.

keyup - se dispara cuando sueltas una tecla.

El método which del evento retorna el código de la tecla oprimida:

$(document).on('keyup', function(e) {

 console.log("La tecla oprimida fue " + e.which);

});