2009-06-19 18 views
2

Ich habe ein Formularauswahlelement, das, wenn ein bestimmter Wert ausgewählt ist, zwei andere Elemente auf der Seite umschalten wird (ein dt/dd-Paar).jQuery toggle nächste zwei Elemente

Das Ereignis wird korrekt ausgelöst, aber ich kann die Elemente nicht umschalten - Hinweis: Ich verwende Klassenselektoren, weil die Anzahl dieser Element- "Mengen" 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 angegeben mehrmals auf der Seite angezeigt werden können):

<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... 

Antwort

2

hier ist das, was Sie wollen:

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

EDIT

ich die Klasse Selektoren zusammen, um es effizienter zu machen kombiniert.

+0

Super - funktioniert super. Vielen Dank! – BrynJ

2

next() nicht tun was du denkst, dass es tut. Versuchen Sie $(this).parent('dl').find('.lender_other1'). Oder, weißt du, vielleicht nur $('.lender_other1'). nur

+0

Ich versuchte $ (this) .parent ('dl'). Find ('. Lender_other1'). Toggle(); aber es scheint nicht zu funktionieren. Nur $ ('. Lender_other1') würde alle Elemente dieser Klasse umschalten, wenn ich nur die verschiedenen nächsten Instanzen dieser Klasse umschalten muss. Ich habe meine Frage aktualisiert, um einen besseren Kontext zu bieten. – BrynJ

1

.next() gibt das nächste Spiel, so denke ich, sollten Sie .nextAll verwenden()

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

+0

Wäre das im Format $ (this) .nextAll (". Lender_other1"). Toggle() ;? Wenn ja, scheint das auch nicht zu funktionieren. Irgendwelche Ideen warum? Vielen Dank. – BrynJ

+0

Da die Auswahl nicht auf derselben Hierarchieebene wie die Elemente ist, auf die Sie zielen möchten. – chaos

+0

guter Punkt - habe die

nicht gesehen. Diese Tags werden nicht häufig angezeigt. Wie auch immer, du musst zuerst zu den Eltern gehen und dann nextAll() verwenden. – ScottE

0

Verwendung slice(start, end) Methode. Dies ist der richtige Weg nach einem Video von John Resig.