jQueryは次の2つの要素を切り替えます

Question

フォーム選択要素があり、特定の値が選択されると、ページ上の他の2つの要素（dt / ddのペア）を切り替えます。

イベントは正しくトリガーされますが、要素を切り替えることができません-これらの要素の数が「設定」されるため、クラスセレクターを使用していることに注意してください。ページ上の変数は可変です。ここに私のコードがあります：

$(".lender_id").change(function () {
if($(this).val()=='45')
   {
   $(this).next(".lender_other1").toggle();
   $(this).next(".lender_other2").toggle();
   }
});

lender_idは私のselect要素クラスであり、次のようなhtmlコードです（前述のように、この要素セットはページに複数回表示される可能性があります）：

<dt>Lender</dt>
<dd><select name="lender_id[1]" class="lender_id">
<option value="1">Value</option>
<option value="45">Special Value</option>
</select></dd>

<dt class="lender_other1" style="display:none;">Lender Name</dt>
<dd class="lender_other2" style="display:none;">
<input type="text" name="lender_other[1]" value="" /></dd>

<dt>Lender</dt>
<dd><select name="lender_id[2]" class="lender_id">
<option value="1">Value</option>
<option value="45">Special Value</option>
</select></dd>

<dt class="lender_other1" style="display:none;">Lender Name</dt>
<dd class="lender_other2" style="display:none;">
<input type="text" name="lender_other[2]" value="" /></dd>

etc...

Answer 1

必要なものは次のとおりです。

$(".lender_id").change(function() {
    if ($(this).val() == '45') {
        $(this).parent().nextAll(".lender_other1:first, .lender_other2:first").toggle();
    };
});

編集

クラスセレクターを組み合わせて、より効率的にしました。

Answer 2

next（） はあなたが思っていることをしませんします。 $（this）.parent（ 'dl'）。find（ '。lender_other1'）を試してください。または、おそらく $（ '。lender_other1'）かもしれません。

Answer 3

.next（）は次の一致のみを返すため、.nextAll（）を使用する必要があると思います

http://docs.jquery.com/Traversing/nextAll#expr

Answer 4

slice（start、end）メソッドを使用します。 john resigのビデオによると、これは正しい方法です。