gpt4 book ai didi

jquery - 如何使用这个例子 addClass 和 removeClass

转载 作者:太空宇宙 更新时间:2023-11-03 23:36:07 25 4
gpt4 key购买 nike

这将从 thumbs class addClass active 中删除 active 类,另一个类都是 removeClass active,但我不知道该怎么做。

    $(document).ready(function(){
$(".thumbgallery .thumb a").click(function(e) {
$(this).parent().addClass("active");
$(this).parent().removeClass("active");

var href = $(this).attr("href");
$(".largethumb img").attr("src",href);
e.preventDefault();
return false;
});
});

//html

<div class="largethumb">
<img src="images/detail/ref.jpg"/>
<a class="left" href="#"> <i class="icon-chevron-left"></i></a>
<a class="right" href="#"> <i class="icon-chevron-right"></i></a>
</div> <!-- End largeImage -->

<div class="thumbgallery clearfix">
<div class="thumb active"><a href="images/detail/ref.jpg"><img src="images/detail/ref.jpg"/></a></div>
<div class="thumb"><a href="images/detail/car2.jpg"><img src="images/detail/car2.jpg"/></a></div>
<div class="thumb"><a href="images/detail/car3.jpg"><img src="images/detail/car3.jpg"/></a></div>
<div class="thumb"><a href="images/detail/car4.jpg"><img src="images/detail/car4.jpg"/></a></div>
<div class="thumb"><a href="images/detail/car5.jpg"><img src="images/detail/car5.jpg"/></a></div>
<div class="thumb"><a href="images/detail/car6.jpg"><img src="images/detail/car6.jpg"/></a></div>
<div class="thumb"><a href="images/detail/car1.jpg"><img src="images/detail/car1.jpg"/></a></div>
<div class="thumb"><a href="images/detail/car6.jpg"><img src="images/detail/car6.jpg"/></a></div>
</div>

最佳答案

我想,您想在单击的 div 上应用“事件”类并从其他 div 中删除?

如果是,那么你应该使用:

$(".thumbgallery .thumb a").click(function(e) {
$('.thumb').removeClass("active"); //-- Remove "active" from all elements with "thumb" class
$(this).parent().addClass("active"); //-- Add class on clicked anchor tag's parent element
var href = $(this).attr("href");
$(".largethumb img").attr("src",href);
e.preventDefault();
return false;
});

Working Example

关于jquery - 如何使用这个例子 addClass 和 removeClass,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24077768/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com