javascript - 从jquery中的div中删除一个类

Question

我在页面上有一组用于切换 div 的链接。单击链接时，它会将“active”添加到所需的 div 并切换它 - 我还切换任何现有的事件 div - 但是我无法开始工作是删除“active”类，因此它不会再次切换.

<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;
});

Answer 1

只需从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