jQueryバインド '変更'複数のフィールドの範囲に

Question

私は2つのタブがあります。各タブには、フィールドの複数のセクションを持つ別々のフォームがあります。フィールドは、ブートストラップラジオまたはチェックボックスボタングループです。

各セクションは任意の数のフィールドを持つことができます。

私が達成しようとしているのは、セクションの最後のいくつかのフィールドが完成したときにのみ、次のセクションが表示されるように、各セクションの最後のいくつかのフィールドにバインド（ '変更'）することです。

私は現在、各セクションのすべてのフィールドにバインドしています。したがって、ユーザーが現在のセクションの最初のフィールドだけを変更した場合は、次のセクションが表示されます。最後のフィールドまたは最後のフィールドから最後のフィールドまでが完了してから次のセクションが表示されるまでに変更したいと思います。

一般的なコード構造の例：https://jsfiddle.net/uqvhw7sb/4/

基本例：

<tab1> 
<formA> 
<groupA> 
<input a[]> 
<input a[]> 
<input a[]> 

<input b[]> 
<input b[]> 
<input b[]> 

<input c[]> 
<input c[]> 
<input c[]> 
</groupA> 

<groupB> 
<input d[]> 
<input d[]> 
<input d[]> 

<input e[]> 
<input e[]> 
<input e[]> 

<input f[]> 
<input f[]> 
<input f[]> 
</groupB> 
</formA> 
</tab1> 

<tab2> 
Same kind of thing, possible same field names 
</tab2> 

Answer 1

あなたは、コレクション内の最後の2つの要素をフィルタリングするslice(-2)を使用することができます。だから、すべてのグループをループし、そのグループ内の入力コレクションを探して

何かのように、そのコレクションをフィルタリング：

$(".fgroups").each(function(){ 
    var $group = $(this); 
    $group.find('input:checkbox').slice(-2).on("change", function() { 
     $group.next().toggle(this.checked); 
    }); 
});