Curso de jQuery | Eventos de la librería jQuery 1

Curso de jQuery
Eventos de la librería jQuery

Curso de jQuery | Eventos de la librería jQuery 2

Para realizar los siguientes ejercicios de eventos, dibujar en pantalla un cuadro de texto (un <input type=»text» >).

Ejercicio

Cuando el input tome el foco, llamar a una función que cambie su value. Cuando lo pierda, llamar a otra función que lo vuelva a cambiar.

Para ejecutar una función cuando el elemento toma el foco:

$("#elemento").on('focus', fn);

Para lanzar una función cuando el elemento pierde el foco:

$("#elemento").on('blur', fn);

Ejercicio

$("#elemento").on('dblclick', fn);
Ver ejercicio

Ejercicio

Implementar los eventos mousedown y mouseup.

$("#buscar").on('mousedown', fn);

$("#buscar").on('mouseup', fn);

Objeto evento

Es creado automáticamente por javascript cuando tiene lugar un evento.

Tiene varias propiedades: type(tipo de evento producido), keyCode(código Unicode) del botón pulsado, button(que botón del ratón fue pulsado)…

No todos lo eventos disponen de todas las propiedades del objeto event.

mousemove

<script type="text/javascript" src="jquery.js"></script>
<script>
 $(document).ready(function(){
  $(document).mousemove(function(event){
   $("#cory").text("coordenada y="+event.pageY);
  });
  $(document).click(function(e){
   $("#corx").text("coordenada x="+e.pageX);
  })
 });
</script>

<p id="corx"></p>
<p id="cory"></p>