jq实现点击容器实现2张图片切换（改变src路径）

最新推荐文章于 2025-06-03 11:35:06 发布

青山拂晓

最新推荐文章于 2025-06-03 11:35:06 发布

阅读量1.7w

点赞数 4

CC 4.0 BY-SA版权

分类专栏： jquery 文章标签： javascript jquery 图片

本文链接：https://blog.youkuaiyun.com/lizhongyu0922/article/details/75092327

jquery 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了一种使用jQuery实现图片切换的方法。通过点击容器触发事件来切换两张图片，详细展示了实现过程中的核心代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

实现点击一个容器实现图片切换的方法有很多，本篇为使用jquery实现点击图片，实现在2张图片来回切换。思路为：

1.点击某个容器触发事件，事件对要处理的目标进行判断。

2.判断如果当前某处的图片的src等于要切换的图片的src，则让src等于第二张图片的路径。

3.如果当前判断的图片与第一张图片的src不同，则让做判断的图片等于第一张图片。

代码如下：

	$('.createbox').click(function(){
			
			if($(this).find('img').attr('src')=='../../images/chose.png'){
				$(this).find('img').attr('src','../../images/chosed.png');
			}else{
				$(this).find('img').attr('src','../../images/chose.png');
			}

			
	});