如何使用 jQuery 在單擊時動態更改圖像來源？

使用jQuery 變更影像來源

如下Web 結構中：

<div>

當使用者按一下圖片，您的任務是將其來源更新為imgx_off.gif，其中 x代表圖片

jQuery 能夠處理此任務，還是 CSS 是首選方法？

使用 jQuery 的 attr() 函數

jQuery 提供attr() 函數，讓您修改屬性值。要更改 ID 為 my_image 的圖像源：

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

基於事件的圖像更改

將此代碼連接到點擊事件：

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

圖片旋轉

實現影像旋轉：

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

以上是如何使用 jQuery 在單擊時動態更改圖像來源？的詳細內容。更多資訊請關注PHP中文網其他相關文章！