jQuery bascule les deux éléments suivants
Question
J'ai un élément de sélection de formulaire qui, lorsqu'une certaine valeur est sélectionnée, bascule sur deux autres éléments de la page (une paire dt / dd).
L'événement est déclenché correctement, mais je ne parviens pas à faire basculer les éléments. Notez que j'utilise des sélecteurs de classe, car le nombre de ces éléments "ensembles". sur la page est variable. Voici mon code:
$(".lender_id").change(function () {
if($(this).val()=='45')
{
$(this).next(".lender_other1").toggle();
$(this).next(".lender_other2").toggle();
}
});
lender_id est ma classe d'élément select, code HTML comme suit (comme indiqué, ce jeu d'éléments peut apparaître plusieurs fois sur la page):
<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...
La solution
voici ce que vous voulez:
$(".lender_id").change(function() {
if ($(this).val() == '45') {
$(this).parent().nextAll(".lender_other1:first, .lender_other2:first").toggle();
};
});
EDIT
J'ai combiné les sélecteurs de classe pour le rendre plus efficace.
Autres conseils
next ()
ne fait pas ce que vous pensez Cela fait. Essayez $ (this) .parent ('dl'). Find ('. Lender_other1')
. Ou, vous savez, peut-être juste $ ('. Lender_other1')
.
.next () ne renvoie que la prochaine correspondance, je pense donc que vous devriez utiliser .nextAll ()
utilisez la méthode slice (début, fin) . c’est la bonne manière selon une vidéo de john resig.