Wie kann ich externe Bilder mit jQuery asynchron laden?

Asynchrones Laden von Bildern mit jQuery

Frage: Ist es möglich, externe Bilder mit jQuery asynchron zu laden? Wenn ja, wie?

Antwort:

Ja, es ist möglich, Bilder asynchron mit jQuery zu laden. Hier sind zwei Methoden, die Sie verwenden können:

Methode 1: Verwenden einer XHR-Anfrage

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

Diese Methode gibt jedoch möglicherweise nicht immer einen Fehler für nicht verfügbare Bilder zurück.

Methode 2: Verwenden der Lademethode

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);
        }
    });

Mit dieser Methode können Sie 404-Fehler behandeln, indem Sie prüfen, ob das Bild beschädigt ist oder nicht.

Das obige ist der detaillierte Inhalt vonWie kann ich externe Bilder mit jQuery asynchron laden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!