如何使用 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中文网其他相关文章！