Con document.ready() indicamos una función a invocar cuando la página está lista para recibir acciones de programación
que modifiquen su estructura.
Con $("#boton").click() indicamos una función a ejecutar cuando se hace clic sobre el botón.
var selectorEscrito = $("#camposelector").attr("value");
Nos sirve para acceder al atributo value del campo de texto, es decir, a lo que haya escrito dentro.
Si no hay nada escrito en el campo, muestro un mensaje de alerta, porque en este caso el selector cadena vacía no sería
valido y recibiríamos un mensaje de error.
Si había algo en el campo, pues selecciono con jQuery los elementos de la página que corresponden con el selector escrito
en el campo de texto.
Eso se hace con la línea:
elementosSeleccionados = $(selectorEscrito);
Luego, sobre el elemento o elementos seleccionados, invoco el método fadeOut(), que sirve para ocultar elementos de la
página.
A fadeOut() le paso dos parámetros, uno es la velocidad con la que tiene que hacer el efecto y otro es una función
callback, a ejecutar sólo en el momento que el efecto haya concluido.
es con la línea:
elementosSeleccionados.fadeOut("slow", function(){
Por último, en la función callback realizamos una llamada al método fadeIn() sobre el mismo objeto jQuery resultado de
aplicar el selector anterior, que sirve para que los elementos ocultados se muestren de nuevo en la página.
Esto último con la
línea:
elementosSeleccionados.fadeIn("slow");
En resumen, ocultando y mostrando luego los elementos de vuelta conseguimos ese parpadeo.
Si nos resulta extraño este
código, recordamos que en el Manual de jQuery de desarrolloweb.com ya hemos publicado varios artículos que aclaran los puntos tratados en este ejemplo, como los efectos rápidos o las funciones callback.
No hay comentarios:
Publicar un comentario