2011-08-18 14 views
7

Estoy tratando de verificar con jQuery si la opción de selección con valor = 1 está seleccionada y luego agregar la clase a algunos elementos. Pero algo no funciona. ¿Puede por favor que alguien mire el código?jQuery Opción IF seleccionada

Mi código:

Reservation <br/> 
<select id="rReservation" name="rReservation" class=""> 
           <option value="0">Maybe</option> 
           <option value="1">Sure</option> 
</select> 
<hr/> 
Name <br/> 
<input type="text" name="rCardUser" class="mRequired" /> 

<hr/> 
Card<br/> 
<input type="text" name="rCardNrr" class="mRequired" /> 

jQuery

if ($("#rReservation").val() == "1") { 
    $('.mRequired').addClass('required'); 
} else { 
    $('.mRequired').removeClass('required'); 
} 

ejemplo VIVO en el violín - http://jsfiddle.net/C7Gg3/

+0

El código se ve muy bien. ¿Qué exactamente no funciona? –

Respuesta

10

que lo necesite dentro de un controlador de eventos:

$('#rReservation').change(function(){ 
    $('.mRequired').toggleClass('required', $(this).val() == '1'); 
}); 

http://jsfiddle.net/AlienWebguy/C7Gg3/1/

Si quieres que active simplemente en carga, es necesario agregar selected="selected" a una de las opciones, ya que hasta que uno sea "seleccionado", $('#rReservation").val() habrá null. Ejemplo: http://jsfiddle.net/AlienWebguy/C7Gg3/3/

+0

Far cleaner para usar '.toggleClass()', amigo ... –

+0

De acuerdo. No quería volver a escribir todo su código, pero supongo que vale la pena intercambiarlo. – AlienWebguy

5

Hay que escuchar al evento change:

$("#rReservation").change(function(){ 
    if ($("#rReservation").val() == "1") { 
     $('.mRequired').addClass('required'); 
    } else { 
     $('.mRequired').removeClass('required'); 
    } 
}); 

http://jsfiddle.net/epkN8/

+1

-1 no, no lo hace. – Maverick

+1

@Matt Anderson: ¿Por qué no? Está tratando de agregar/eliminar una clase cada vez que se selecciona una opción. La única forma de hacerlo, AFAIK, es escuchar el evento 'change'. ¿Me estoy perdiendo de algo? –

+0

Dijo 'Estoy tratando de verificar con jQuery si la opción de seleccionar con valor = 1 está seleccionada y luego agregar clase a algunos elementos'. Si hubiera agregado la propiedad "seleccionada" a cualquiera de sus etiquetas '

0

Usted tiene que asegurarse de que ha envuelto su código en un evento de cambio de manera que usted está escuchando el cambio sucediendo

http://jsfiddle.net/C7Gg3/2/

$('#rReservation').change(function(){ /* my code goes here */}); 
3

Tal vez usted quiere añadir/eliminar la clase cada vez que cambia el valor <select>:

$(function() 
{ 
    $("#rReservation").change() 
    { 
     $('.mRequired').toggleClass('required', $(this).val() == "1"); 
    } 
}); 
+0

+1 para sugerir el uso de alternar con el argumento de condición. – AlienWebguy

Cuestiones relacionadas