jQuery Jquery动态添加和删除类
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4676562/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Jquery adding and removing class dynamically
提问by user244394
I am trying to add the class"selected" when a link is clicked and when the user click on the next link , I want to remove the previously "selected" class and add "selected" to the link clicked..
我试图在单击链接时添加“选定”类，当用户单击下一个链接时，我想删除以前的“选定”类并将“选定”添加到单击的链接中。
-Thanks in advance
-提前致谢
$(document).ready(function() {
$('.news a').click(function(){
$(this).addClass("selected");
});
});
<div class="news-w">
<div class="news" id="getnews-1">
<a href="#" >topic</a>
</div>
<div class="news" id="getnews-2">
<a href="#">topic</a>
</div>
<div class="news" id="getnews-3">
<a href="#" >topic</a>
</div>
<div class="news" id="getnews-4">
<a href="#">topic</a>
</div>
<div class="news" id="getnews-5">
<a href="#">topic</a>
</div>
</div>
回答by Sanjeev Satheesh
$(document).ready(function() {
$('.news a').click(function(){
$('.selected').removeClass('selected')
$(this).addClass("selected");
});
});
回答by Segun Kess
To add a toggle effect when adding a class or an ID, Use this.
要在添加类或 ID 时添加切换效果，请使用此选项。
$(document).ready(function() {
var count = 1;
$('#ddown').click(function(){
count++;
if (count % 2 == 0) {
$('#ddown').addClass('dropup');
$('#ddown').removeClass("dropdown");
}else{
$('#ddown').removeClass("dropup");
$('#ddown').addClass("dropdown");
}
});
});
Yea i know, I came to the party very late.
是的，我知道，我来晚了。
回答by rahul
Try
尝试
$(document).ready(function() {
$('div.news-w div.news a').click(function(){
$('div.news-w div.news a.selected').removeClass("selected");
$(this).addClass("selected");
});
});
Also you are having an invalid HTML. You have more than 1 element with the same ID.
此外，您的 HTML 无效。您有 1 个以上具有相同 ID 的元素。
回答by Chandu
Another alternate solution is:
另一种替代解决方案是：
var prevLink = null;
$(document).ready(function() {
$('.news a').click(function(){
if(prevLink) prevLink.removeClass('selected');
prevLink = $(this).addClass("selected");
});
});
回答by Joko Wandiro
You can use this:
你可以使用这个：
$('.news a').click(function(){
$('.news-w').find('.selected').removeClass('selected');
$(this).addClass("selected");
});
it will be removed automatically just class selectedin div class='news-w'
它会自动删除只是在div class='news-w' 中选择的类
If u use this :
如果你使用这个：
$('.selected').removeClass('selected');
when u want to add more element ainto DOM out from div class='news-w'it will be removed too..
当你想从div class='news-w'向 DOM添加更多元素a时， 它也会被删除..
