原型大概是这样的
image
需求：点击右侧的蓝色眼睛，会变成
关键代码：
/* 实现图片切换 */
$(".imgclick").toggle(function(){
$(this).attr("src","img/close.png");
},function(){
$(this).attr("src","img/open.png");
}).attr("src","img/open.png");
其实原理很简单，就是利用toggle的参数切换不同函数。
可以直接复制黏贴的demo
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
</head>
<body>
<div>
<img class="imgclick" src="img/close.png" />
</div>
<div>
<img class="imgclick" src="img/close.png" />
</div>
</body>
<script>
/* 实现图片切换 */
$(".imgclick").toggle(function() {
$(this).attr("src", "img/close.png");
}, function() {
$(this).attr("src", "img/open.png");
}).attr("src", "img/open.png");
</script>
</html>
==================================================================
注意：本文原创作者祈澈姑娘，创作不易。转载请标明作者和文章的原文链接，或到微信公众号获取授权。
若需要转载，联系原文作者
更多技术文章，行业交流，web前端开发资源，前端交流群，开源代码，前端干货，职场感悟，求职指导，请点击公众号原文链接：祈澈姑娘
或者联系我的微信，创作不易，走过路过点个赞呗