2
我有以下图标,我想单击时更改它们中的每一个,并在单击另一图像后将图像更改为原始图像。我如何使用jQuery来做到这一点?如何在点击图片时更改图片?
<ul>
<li><a class="button" id="mobile-icon" href="#"><img src="images/mobile-icon.png" class="defaultimg"></a><h4>Mobile</h4></li>
<li><a class="button" id="music-icon" href="#" ><img src="images/music-icon.png" class="defaultimg"></a><h4>Music</h4></li>
<li><a class="button" id="camera-icon" href="#" ><img src="images/camera-icon.png" class="defaultimg"></a><h4>Camera</h4></li>
<li><a class="button" id="computers-icon" href="#" ><img src="images/computers-icon.png" class="defaultimg"></a><h4>Computers</h4></li>
</ul>
我只编写jquery到这个目标..我被卡住了。请帮助..
$(document).ready(function() {
$('.button').click(function(){
$('.clicked').removeClass("clicked")
$(this).addClass("clicked")
if ($(".button").hasClass("clicked")) {
var id = $(this).find('img');
var idToSRC = 'images/'+ this.id + '_hover' +'.png';
id.attr('src', idToSRC);
}else if($(".button").not("clicked")){
id.removeAttr('src', idToSRC);
}
});
嗨对不起,我认为我错误地写了我的问题,如何将图像更改为其原始后,另一个图像被点击? – Untitled
谢谢!你能解释代码功能吗? – Untitled
@无题在评论中新增了解释 –