jQuery：クラスが存在する場合は削除してから新しい要素に追加します

Question

私はアコーディオンスタイルのビデオセクションで作業しています。私は現在、クラスがクリックに存在するかどうかをチェックしようとしています。私は一度にオープン1セクションにそれをしたいので、それは、クラス

を削除しない場合は、クラスが

クリック上に存在する場合、私は

1. チェックする必要がクリックされた要素

にクラスを追加します。

私はちょうどaddClass();とtoggleClass();でこれをやってみましたが、私が迷っているものは100％確信していません。

クラスの追加

$(".contents-row").click(function(){ 
    $(this).toggleClass("content-open"); 
}); 

トグルクラス

$('.contents-row').click(function(){ 
    $(this).toggleClass('content-open'); 
}); 

これは、基本的なHTMLが設定されている

<div class="contents-row"> 
    <div class="content-option press"> 
     <div class="class-section-title">test1</div> 
    </div> 
    <div class="drop"> 
     test 1 
    </div> 
</div> 

ドロップダウンのフルバージョンはJSFiddleです。

ありがとうございました！

Answer 1

content-openクラスを持つすべての要素から最初にcontent-openクラスを削除します。次に、クリックした要素にクラスを追加します。

$('.contents-row').click(function(){ 
    $('.content-open').removeClass('content-open'); 
    $(this).addClass('content-open'); 
}); 

Answer 2

私はあなたがこれを使用することができたとします

$('.contents-row').click(function(){ 
    $('.contents-row').each(function(){ 
      $(this).removeClass('content-open'); 
    }) 
     $(this).toggleClass('content-open'); 
}); 

jsfiddle：https://jsfiddle.net/8822fmhk/

Answer 3

あなたが最初のクラスcontents-rowですべてdivからクラスcontent-openを削除し、現在divクリックに追加する必要があります。

$('.contents-row').click(function(){ 
    $('.contents-row').removeClass('content-open'); 
    $(this).toggleClass('content-open'); 
});