Catching img load error per i tag <img> creati dopo il caricamento della pagina (ad esempio tramite AJAX)

Question

Sto utilizzando il gestore di eventi error di jQuery per rilevare errori di caricamento delle immagini. Assomiglia a questo:

$(function(){ 
    $('img').error(function(){ 
    // ... do something 
    }) 
}) 

Questo funziona perfettamente per le immagini che si trovano nel DOM quando la pagina viene caricata. Tuttavia, mi piacerebbe rilevare gli errori relativi ai tag <img> che vengono inseriti anche tramite AJAX. Preferirei non dover eseguire determinati codici dopo ogni chiamata AJAX.

Mi piacerebbe qualcosa di simile, anche se questo non sembra funzionare:

$('body').on('error', 'img', function(){ 
    // ... do something 
}) 

Answer 1

Se non si desidera impostare il legame dopo ogni chiamata ajax, si potrebbe desiderare di metterlo in un ajax globale funzione completa

//Gloabal Ajax Complete 
$("body").bind("ajaxSend", function(e, xhr, settings){ 
    //Sent 
}).bind("ajaxComplete", function(e, xhr, settings){ 
    //Complete 
    $('img').error(function(){ 
     // ... do something 
    }) 
}).bind("ajaxError", function(e, xhr, settings, thrownError){ 
    //Error 
}); 

Answer 2

È possibile utilizzare di jQuery dal vivo() o suo delegato() o su() metodi a seconda della versione di jQuery che si sta utilizzando per registrare l'evento di errore su elementi di immagine attuali e future aggiunte a il documento. Refer http://api.jquery.com/live/