Devo essere in grado di rilevare se un'immagine è rotta e sostituirla con un'immagine predefinita se il collegamento dell'immagine è rotto. So che potrei fare questo con un proxy di immagine, ma speravo di farlo al volo con javascript.Modo per rilevare le immagini rotte in javascript?
Credo che sia l'evento onerror dell'elemento img. onerror=function(){} sebbene non l'abbia mai usato.
È possibile utilizzare <img onerror='doWhateverFunction()' etc etc
http://msdn.microsoft.com/en-us/library/cc197053(v=VS.85).aspx
modo davvero ingegnoso di fare questo! – KalC
Esempio di codice:
<script language='javascript'>
function defaultImage(img)
{
img.onerror = "";
img.src = 'default.gif';
}
</script>
<img alt="My Image" src="someimage.gif" onerror="defaultImage(this);" />
Nel solito caso, funzionerà correttamente. Ma sono abbastanza sicuro che ciò causerà un loop infinito se 'default.gif' è anche rotto/non trovato. Ecco perché in http://stackoverflow.com/questions/92720/jquery-javascript-to-replace-broken-images la risposta AC imposta img.onerror su blank nella funzione defaultImage –
Good point. Lo cambierò. –
Come ogni caso il onerror si propagheranno verso l'alto sul DOM, così da poter prendere un gestore generico per questo tipo di errori.
<script type="text/javascript">
jQuery(document).bind('error', function(event) {
console.log(event.target.src);
});
</script>
post simile: http://stackoverflow.com/questions/92720/jquery-javascript-to-replace-broken-images – jessegavin