Jquery动态添加和删除类

时间:2011-01-13 03:40:37

标签: jquery class

我正在尝试添加课程"已选择"当点击一个链接并且当用户点击下一个链接时,我想删除之前的"选择"上课并添加"选择"点击链接..

- 提前谢谢

$(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>

5 个答案:

答案 0 :(得分:6)

$(document).ready(function() {
    $('.news a').click(function(){
         $('.selected').removeClass('selected')
         $(this).addClass("selected");
    });
});

答案 1 :(得分:2)

尝试

$(document).ready(function() {
    $('div.news-w div.news a').click(function(){
       $('div.news-w div.news a.selected').removeClass("selected");
       $(this).addClass("selected");
    });
});

您的HTML也是无效的。您有多个具有相同ID的元素。

答案 2 :(得分:1)

另一种替代解决方案是:

var prevLink = null;
$(document).ready(function() {
    $('.news a').click(function(){
         if(prevLink) prevLink.removeClass('selected');
         prevLink = $(this).addClass("selected");
    });
});

答案 3 :(得分:1)

要在添加类或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");
                    }
                });
            });

是的,我知道,我很晚才来参加聚会。

答案 4 :(得分:0)

您可以使用:

$('.news a').click(function(){
$('.news-w').find('.selected').removeClass('selected');
$(this).addClass("selected");
});

div class ='news-w'

将自动将其删除选择

如果你使用这个:

$('.selected').removeClass('selected');

当你想要将更多元素 a 添加到DOM中时 div class ='news-w'它也会被移除..