Assurez-vous que les images sont préchargées dans un appel Ajax

Question

J'ai remarqué qu'un appel Ajax jQuery ne précharge/ne charge pas les images de la page cible avant les rappels. Donc, fondamentalement, il charge juste le html et ensuite faire le rappel et après le rappel, il commence à charger l'image/images. Donc, ma question est de savoir s'il existe un moyen de s'assurer que les images de la page cible sont également chargées/préchargées avant la fonction d'ajout.

Exemple de code:

$.ajax({ 
    url: ''+nextHref+'', 
    success: function(data) { 

    var $response = $(data); 
    var oneval = $response.find('#ContainerWrapper').html(); 

    // Then some kind of function that preloads the target images before it appends the ajax result. So basically the part below is where I don't know what o do. 
    $response.find('#ContainerWrapper img').examplepreloadfunction(function(){ 

     $("#ContainerWrapper").append(oneval); 

    }); 

    } 
}); 

Toutes les réponses, des indices, des idées ou des expériences?

Answer 1

Pour précharger une image:

$('<img/>')[0].src = '/path/to/image'; 

ou:

(new Image()).src = '/path/to/image'; 

Vous pouvez essayer cela pour chaque image avant d'injecter le code HTML que vous avez reçu de l'appel AJAX dans le DOM.