Inicio JavaScript JQuery Eliminar imagenes rotas o con error con jquery

Eliminar imagenes rotas o con error con jquery

Jueves, 08-12-2011 20:54 - Leer comentarios - Comentar

Algo demasiado habitual como los errores de codificación, dependencias acopladas a enlaces externos,... pueden dar al traste con el diseño de nuestras páginas web.
Y es que cualquiera de los puntos citados anteriormente pueden hacer que tengamos imágenes rotas en nuestra página, las cuales estropeen el contenido de las mismas.
Si bien, mediante sencillos scripts podemos eliminar imágenes rotas con jQuery. La idea es recorrer todas las imágenes que haya en la página y si la imagen tiene un error, eliminarla.
Lo primero es saber como acceder a las imágenes mediante jQuery. Para ello utilizamos el siguiente código:
JavaScript
$("img")
El selector pasado a la función $ es el del elemento IMG. Como queremos saber si se ha producido un error en la carga de la imagen pasaremos a tratar el evento .error().
JavaScript
$("img").error(...);
Dentro de la gestión del evento .error() tomaremos la decisión sobre qué hacer. En este caso, como vamos a eliminar las imágenes rotas, llamaremos al método .remove() de jQuery.
JavaScript
$('img').error(function() {
  $(this).remove();
})
Este código lo tendremos que ejecutar cuándo se haya cargado la página. Es decir, en el método .ready().
JavaScript
 $(document).ready(function(){
   $('img').error(function() {
     $(this).remove();
   })
 });

Tags

imagenes, rotas, javascript, jqueruy

Comentarios

Kristine - Jueves, 09-02-2012 22:15

Thanks for shrniag this, its really cool special the java script basics. And also the tutorial link.–Hari


No se permiten comentarios en este momento.