jQuery alterna los siguientes dos elementos
Pregunta
Tengo un elemento de selección de formulario que, cuando se selecciona un cierto valor, alternará otros dos elementos en la página (un par dt / dd).
El evento se desencadena correctamente, pero no puedo hacer que los elementos se activen.Tenga en cuenta que estoy usando selectores de clase porque el número de estos elementos " establece " en la página es variable. Aquí está mi código:
$(".lender_id").change(function () {
if($(this).val()=='45')
{
$(this).next(".lender_other1").toggle();
$(this).next(".lender_other2").toggle();
}
});
lender_id es mi clase de elemento select, código html de la siguiente manera (como se indicó, este conjunto de elementos puede aparecer varias veces en la página):
<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...
Solución
esto es lo que quieres:
$(".lender_id").change(function() {
if ($(this).val() == '45') {
$(this).parent().nextAll(".lender_other1:first, .lender_other2:first").toggle();
};
});
EDITAR
Combiné los selectores de clase para hacerlo más eficiente.
Otros consejos
next ()
no hace lo que usted piensa lo hace. Pruebe $ (this) .parent ('dl'). Find ('. Lender_other1')
. O bien, tal vez solo $ ('. Lender_other1')
.
.next () solo devuelve la próxima coincidencia, por lo que creo que debería estar usando .nextAll ()
utilice el método slice (inicio, fin) . esta es la forma correcta de acuerdo con un video de John Resig.