Giả sử ta có thẻ HTML sau:<div id="d1">
<div class="c1">
<a href="#"><img src="img1_on.gif"></a>
<a href="#"><img src="img2_on.gif"></a>
</div>
</div>
Bây giờ làm thế nào thay thành <img src="imgx_off.gif">
Cách đơn giản là sử dụng Jquery như sau:
Đổi cấu trúc trên, thêm thẻ Id vào
<img id="my_image" src="img1_on.gif"/>
Trong thẻ Script
$("#my_image").attr("src","img1_off.gif.jpg");Nâng cao trong thẻ Script lên
$('#my_image').on({
'click': function(){
$('#my_image').attr('src','img1_off.gif.jpg');
}
});Nâng cao thêm tí nữa, bỏ lun id="my_image"
$('img').on({
'click': function() {
var src = ($(this).attr('src') === 'img1_on.jpg')
? 'img2_on.jpg'
: 'img1_on.jpg';
$(this).attr('src', src);
}
});