Wie kann jQuery verwendet werden, um Bildquellen beim Klicken dynamisch zu ändern?

Verwenden von jQuery zum Ändern von Bildquellen

Innerhalb einer Webstruktur wie:

<div>

wenn Benutzer auf eine klicken Um ein Bild zu erstellen, müssen Sie dessen Quelle auf imgx_off.gif aktualisieren, wobei x das Bild darstellt Zahl.

Ist jQuery in der Lage, diese Aufgabe zu bewältigen, oder ist CSS die bevorzugte Methode?

Verwendung der attr()-Funktion von jQuery

jQuery stellt die attr()-Funktion, mit der Sie Attributwerte ändern können. So ändern Sie die Quelle eines Bildes mit der ID „my_image“:

$('#my_image').attr('src', 'second.jpg');

Ereignisbasierte Bildänderung

Verbinden Sie diesen Code mit einem Klickereignis:

$('#my_image').on({
    'click': function(){
        $('#my_image').attr('src','second.jpg');
    }
});

Bilddrehung

Um das Bild zu implementieren Rotation:

$('img').on({
    'click': function() {
         var src = ($(this).attr('src') === 'img1_on.jpg')
            ? 'img2_on.jpg'
            : 'img1_on.jpg';
         $(this).attr('src', src);
    }
});

Das obige ist der detaillierte Inhalt vonWie kann jQuery verwendet werden, um Bildquellen beim Klicken dynamisch zu ändern?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!