Удалить класс из div в jquery

У меня есть набор ссылок на странице, которые переключают 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;
});

javascript html jquery removeclass
person Tomate    schedule 13.11.2013    source источник
comment
Не могли бы вы сделать скрипку с HTML, пожалуйста   -  person aaronmallen    schedule 14.11.2013
comment
Вы хотели добавить активный класс в ссылку?   -  person PSL    schedule 14.11.2013
comment
это странно - должно быть, в какой-то момент у меня было что-то еще не так, поскольку оно было просто активным, и оно не работало - спасибо.   -  person Tomate    schedule 14.11.2013

Ответы (2)


arrow_upward
4
arrow_downward

Просто нужно удалить . из значения removeClass, поскольку removeClass принимает имя класса, а .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;
   });

Демо

person PSL    schedule 13.11.2013

arrow_upward
0
arrow_downward

removeClass() не требует предварительных условий селектора.

Также может быть лучше для использования памяти добавить .active к вашему выбору:

$('#content div.active').removeClass('active');
person BenM    schedule 13.11.2013