我有这个HTML结构:
$("li").on("click", function(){
// I need to remove active-class form current element
$(this).addClass("active");
});

li:hover{
background-color: #eee;
cursor: pointer;
}
.active{
color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Numbers:
<ul>
<li>One</li>
<li class="active">Two</li>
<li>Three</li>
<li>Four</li>
<li>Five</li>
</ul>
&#13;
在上面的代码中,当您点击<li>
标记的内容时,active
类将添加到该元素中。现在我想检测active
类是否在哪个元素上?首先从(.removeClass()
)中删除该类,然后将active
类添加到单击的元素中。换句话说,我需要使它(active
class)唯一。
我该怎么做?
答案 0 :(得分:5)
请使用:
- (void)viewWillTransitionToSize:(CGSize)size withTransitionCoordinator:(id<UIViewControllerTransitionCoordinator>)coordinator
{
[super viewWillTransitionToSize:size withTransitionCoordinator:coordinator];
[self.collectionViewLayout invalidateLayout];
[self.collectionView reloadData];
}
首先从上一个活动元素中删除活动类:$("li").on("click", function(){
$('li.active').removeClass('active');
// I need to remove active-class form current element
$(this).addClass("active");
});
,然后只更新单击的元素。
答案 1 :(得分:3)
您可以使用.siblings()
$("li").on("click", function(){
$(this).siblings().removeClass('active');
$(this).addClass("active");
});
li:hover{
background-color: #eee;
cursor: pointer;
}
.active{
color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
<li>One</li>
<li class="active">Two</li>
<li>Three</li>
<li>Four</li>
<li>Five</li>
</ul>
答案 2 :(得分:2)
使用not()选择除被点击的所有活动类别之外的所有活动类别并删除其活动链接
$("li").on("click", function(){
$(this).addClass("active");
$("li.active").not(this).removeClass('active');
});
答案 3 :(得分:2)
试试这个
$("li").on("click", function(){
$("li.active").removeClass("active");
$(this).addClass("active");
});