vedi se src of img esiste

Question

quando inserisco un tag img, creo dinamicamente l'attributo src. Esiste un modo di test se lo src (percorso in cui si trova l'immagine) in realtà esiste con javascript al fine di evitare di ottenere:

Answer 1

È possibile utilizzare l'evento error:

var im = document.getElementById('imageID'); // or select based on classes 
im.onerror = function(){ 
    // image not found or change src like this as default image: 

    im.src = 'new path'; 
}; 

Inline Versione:

<img src="whatever" onError="this.src = 'new default path'" /> 

O

<img src="whatever" onError="doSomething();" /> 

---

<img> tag supporta i seguenti eventi:

• abort (OnAbort)
• error (onerror)
• load (onLoad)

Ulteriori informazioni:

• JavaScript Events
• jQuery's error

Answer 2

è possibile effettuare una precedente chiamata ajax (con head metodo) e vedere il codice di ritorno del server oppure è possibile utilizzare onerror evento per modificare url o renderlo nascosto, ad es

<img src="notexist.jpg" onerror="this.style.visibility = 'hidden'"> 

(ho usato l'attributo in linea solo per spiegare l'idea)

Answer 3

ci si avvicina nel modo sbagliato.
Quando si generano i collegamenti con lo script lato server, controllare lì se il file esiste o meno (utilizzando file_exists() in PHP, ad esempio).

Non si deve fare affidamento su JavaScript quando è possibile farlo sul lato server, poiché JavaScript può essere modificato e disabilitato.

Chiedetevi come si generano gli attributi src= e verificare se il file esiste o meno e fornire un'alternativa.

Answer 4

Se si crea lo src dinamicamente con javascript è possibile utilizzare questo:

var obj = new Image(); 
 
    obj.src = "http://www.javatpoint.com/images/javascript/javascript_logo.png"; 
 

 
if (obj.complete) { 
 
    alert('worked'); 
 
} else { 
 
    alert('doesnt work'); 
 
}