jquery - アコーディオンでアクティブなパネルを識別する方法

Question

コーディングでjQueryアコーディオンを使用しています。

アコーディオンに36個のパネルがあり、それぞれにフォームがあります。

送信ボタンをクリックすると、開いている/アクティブなパネルの形式で入力テキストボックスにあるものを取得したいと思います。

関連するフォームを送信するために開いているアクティブなパネルを識別する方法は？

Answer 1

javascriptを使用してそのようなことを行うときはいつでも、現在選択されている要素に「active」クラスを追加します。

$("a.navigation").click(function(e)
{
if($(this).is(".active")) return false;

$("a.navigation").removeClass("active");
$(this).addClass("active");

そうすれば、何がアクティブ化されているかを常に簡単に検出し、それに基づいて行動することができます。

Answer 2

<div id="accordion">
  <h3 class="panel-header" data-panel-no="1">Section 1</h3>
  <div>
    <p>
    Mauris 
    </p>
  </div>
  <h3 class="panel-header" data-panel-no="2">Section 2</h3>
  <div>
    <p>
    </p>
  </div>...
</div>

jquery onclick on class="panel-header" を使用して data-panel-no 属性値を取得し、一時変数に保存します。

var activePanel=-1;
$(function(){
   $(".panel-header").click(function()
    {
        activePanel = $(".panel-header").attr("data-panel-no").val();
    }
})

お役に立てれば