jQuery schalten nächsten zwei Elemente
Frage
Ich habe eine Form Auswahlelement, das, wenn ein bestimmter Wert gewählt ist, wird zwei weitere Elemente auf der umzuschalten (a dt / dd-Paar).
Das Ereignis wird korrekt ausgelöst, aber ich kann die Elemente nicht bekommen wechseln - beachten Sie, ich Klasse Selektoren verwenden, weil die Anzahl dieses Element „Sets“ auf der Seite variabel ist. Hier ist mein Code:
$(".lender_id").change(function () {
if($(this).val()=='45')
{
$(this).next(".lender_other1").toggle();
$(this).next(".lender_other2").toggle();
}
});
lender_id ist mein select-Element-Klasse, HTML-Code wie folgt (wie dieses Element Satz erwähnt kann mehrmals auf der Seite angezeigt):
<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...
Lösung
Hier ist, was Sie wollen:
$(".lender_id").change(function() {
if ($(this).val() == '45') {
$(this).parent().nextAll(".lender_other1:first, .lender_other2:first").toggle();
};
});
EDIT
I kombiniert zusammen, um die Klassen-Selektoren, um es effizienter zu machen.
Andere Tipps
next()
nicht tut, was Sie denken, es tut. Versuchen Sie $(this).parent('dl').find('.lender_other1')
. Oder wissen sie, vielleicht auch nur $('.lender_other1')
.
.next () nur das nächste Spiel zurückkehrt, so dass ich denke, Sie sollten .nextAll werden ()
verwenden slice (Anfang, Ende) Methode. Dies ist die richtige Art und Weise nach einem Video von John Resig.