0

ページに 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;
});
4

2 に答える 2

4

.removeClass は className を取り、クラス名ではないため、removeClass の値から削除する必要があり.activeます (セレクターを提供するつもりだったと思います)。

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

する必要があります

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

ちょうど別のアプローチ:

HTML:- data-target 属性を追加し、そこにセレクターを提供します。

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

デモ

于 2013-11-13T22:23:15.963 に答える
0

removeClass()セレクタの前提条件は必要ありません。

また、メモリ使用量を.active選択に追加することをお勧めします。

$('#content div.active').removeClass('active');
于 2013-11-13T22:24:24.430 に答える