Comprobar si imagen existe

delta132 · #1 (**permalink**) 12/03/2009, 10:45

Hola a todos, tengo un problemita ... necesito saber con javascript si una imagen existe, por ejemplo ../imagen/boton1.jpg y si no existe que carge ../../imagen/boton1.jpg , muchas gracias por la ayuda que me puedan brindar, solo puedo javascript..

Muchas gracias espero me puedan colaborar...

Panino5001 · #2 (**permalink**) 12/03/2009, 10:55

Código:

<img src="algo.jpg" onerror="this.src='sustituta.jpg'" />

Ojo, si sustituta.jpg no existe entrás en un bucle infinito.

delta132 · #3 (**permalink**) 12/03/2009, 11:03

Muchas gracias por responder ... pero si tengo mas imagenes, por ejemplo 5? .. gracias ...

Panino5001 · #4 (**permalink**) 12/03/2009, 11:09

A cada una le agregás un onerror y listo. (El evento onerror está asociado a la imagen que lo usa, no a toda la página.)

delta132 · #5 (**permalink**) 12/03/2009, 11:25

Cita:

Iniciado por Panino5001

A cada una le agregás un onerror y listo. (El evento onerror está asociado a la imagen que lo usa, no a toda la página.)

Si señor, lo que pasa es cuando la imagen es en una sola imagen, ej:

Insert la imagen tag img, si no existe onerror y cargo la otra, pero si esa tampoco existiese como haría la carga? Gracias de nuevo.

Panino5001 · #6 (**permalink**) 12/03/2009, 12:33

Fijate si te sirve:

Código:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>test</title>
<script>
function manejar(o,i){
	if(typeof i=='undefined')i=0; else i++;
	var pos=['1.jpg','2.jpg','3.jpg','4.jpg','5.jpg'];
	if(pos[i]){
		o.src=pos[i];
		o.onerror=function(){manejar(o,i);}
		document.getElementById('log').innerHTML+='intentando cargar'+pos[i]+'<br />';
	}else{
		document.getElementById('log').innerHTML+='no hay caso';
		//o.parentNode.replaceChild(document.createTextNode('imagen inexistente'),o);
	}
}
</script>
</head>

<body>
<img src="noExisto" onerror="manejar(this)" />
<div id="log"></div>
</body>
</html>