有两张图片microphone1.png和microphone0.png
html:
<div class="microphone">
<img src="images/microphone1.png" />
</div>
想要实现点击div,图片切换成另一张,再次点击,图片又切换回现在这一张
使用jquery,设计一个变量var flag=true;根据变量变化,选择图片
var flag=true;
$(".microphone").click(function(){
if(flag){
$(this).find("img").attr("src","images/microphone0.png");
$(this).siblings(".microphonetip").text("对讲已关闭");
flag=false;
}else{
$(this).find("img").attr("src","images/microphone1.png");
$(this).siblings(".microphonetip").text("对讲已打开");
flag=true;
}
})
二选一的操作,需要变量只有两种,true和false,也可以使用一对数字,不过需要注意的是if使用条件是flag或flag==1,中间用两个等号或三个等号,==表示相同,===表示严格相同,这么理解: 当进行双等号比较时候: 先检查两个操作数数据类型,如果相同, 则进行===比较, 如果不同, 则愿意为你进行一次类型转换, 转换成相同类型后再进行比较, 而===比较时, 如果类型不同,直接就是false.