从jquery中的div中删除一个类

时间:2013-11-13 22:20:51

标签: javascript jquery html removeclass

我在页面上有一组切换div的链接。单击链接时,它会将“活动”添加到所需的div并切换它 - 我也切换任何现有的活动div - 但是我无法工作的是删除“活动”类,因此它不会再切换

<a href="valor" class="mas">link</a>
<a href="acaba" class="mas">link</a>
<a href="soluc" class="mas">link</a> 

<div id ="content">   
<div class="valor">TEXT</div>
<div class="acaba">TEXT</div>
<div class="soluc">TEXT</div> 
</div>

$(".mas").click(function () {
    var divToShow = "." + $(this).attr('href');
    $(".active").toggle("fast");
    $("#content div").removeClass(".active");
    $(divToShow).toggle("fast");
    $(divToShow).addClass("active");
    return false;
});

2 个答案:

答案 0 :(得分:4)

只需要从removeClass的值中删除.,因为removeClass接受className而.active不是类名(我认为你的意思是提供一个选择器)。

$("#content div").removeClass(".active");

应该是

$("#content div").removeClass("active");

另一种方法:

HTML: - 添加数据目标属性并在那里提供选择器。

 <a href="#" data-target=".valor" class="mas">link</a>  
 <a href="#" data-target=".acaba" class="mas">link</a>
 <a href="#" data-target=".soluc" class="mas">link</a> 
<div id="content">
    <div class="valor">TEXT1</div>
    <div class="acaba">TEXT2</div>
    <div class="soluc">TEXT3</div>
</div>

JS:

   $(".mas").click(function () {
       var divToShow = $(this).data('target');
       $('#content').children().not( //Hide all the children
              $(divToShow).toggle('fast').addClass('active') //But not the target which you do a toggle
       ).hide("fast").removeClass('active');
       return false;
   });

<强> Demo

答案 1 :(得分:0)

removeClass()不需要选择器先决条件。

将内存使用情况添加到您的选择中可能会更好:

.active