Comment puis-je charger de manière asynchrone des images externes à l'aide de jQuery ?

Chargement d'images asynchrones avec jQuery

Question : Est-il possible de charger des images externes de manière asynchrone à l'aide de jQuery ? Si oui, comment ?

Réponse :

Oui, il est possible de charger des images de manière asynchrone à l'aide de jQuery. Voici deux méthodes que vous pouvez utiliser :

Méthode 1 : Utiliser une requête XHR

$.ajax({
    url: "http://somedomain.com/image.jpg",
    timeout: 5000,
    success: function() {
        // Handle success
    },
    error: function(r, x) {
        // Handle error
    }
});

Cependant, cette méthode peut ne pas toujours renvoyer une erreur pour les images indisponibles.

Méthode 2 : Utiliser la charge Méthode

var img = $('<img />').attr('src', 'http://somedomain.com/image.jpg')
    .on('load', function() {
        if (!this.complete || typeof this.naturalWidth == "undefined" || this.naturalWidth == 0) {
            alert('Broken image!');
        } else {
            $("#something").append(img);
        }
    });

Cette méthode permet de gérer les erreurs 404 en vérifiant si l'image est cassée ou non.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!