2011-04-11 21 views
46

¿Hay alguna razón para que val() sea inútil para los controles de casilla de verificación, mientras que es útil para obtener datos de entrada consistentemente a través de cualquier otro control de entrada?jQuery val() y casillas de verificación

p. Ej. para las casillas de verificación, en aparece en , siempre vuelva a "on" independientemente del estado de la casilla de verificación. Para otros controles de entrada que en realidad no tienen un atributo de "valor", p. select y textarea, se comporta como era de esperar. Ver:

http://jsfiddle.net/jamietre/sdF2h/4/

no puedo pensar en una buena razón por la que no volvería true o false. De lo contrario, al menos, vuelva a "activar" solo cuando esté marcado, y una cadena vacía cuando no lo esté. De lo contrario, al menos siempre devuelve una cadena vacía, dado que las casillas de verificación no tienen el atributo value.

Obviamente sé cómo obtener el valor usando attr, pero esta es la situación. Estoy desarrollando una implementación C jQuery simple (hasta ahora de todos modos) para hacer un análisis HTML en el servidor, y estoy tratando de ser completamente fiel a la implementación de jQuery, por lo que se comporta de manera consistente en el cliente o servidor contra el mismo DOM. Pero esto parece estúpido y me está costando llegar a codificar el "valor" para volver a "ENCENDER" una casilla de verificación pase lo que pase. Pero si no lo hago, no será consistente. Así que estoy tratando de entender, ¿hay alguna razón para hacer esto? ¿Sirve para algún propósito, o es simplemente un artefacto de algún tipo? ¿Alguna vez alguien usaría el método val() en una casilla de verificación? De ser así, ¿por qué? Si no, ¿por qué los arquitectos de jQuery decidieron sobre este enfoque para que no sea útil?

+0

también debe cerrar sus etiquetas de opción – mcgrailm

+0

Esto es muy extraño, pero es javascript. Simplemente ve con attr ('marcado') y lamentablemente no debes ser consistente. : | – ohmusama

Respuesta

61

no puedo pensar en una buena razón por la que no volvería verdadero o falso. Error al que, al menos, vuelve a "activarse" cuando se comprobó , y una cadena vacía cuando no está activada. En su defecto, al menos siempre devuelva una cadena vacía, dado que las casillas de verificación no tienen ningún atributo de valor.

Las casillas de verificación tienen un atributo de valor. Es bastante común usarlo en, por ej. multi-casillas de verificación en formas, por ejemplo:

<input type="checkbox" name="foo[]" value="1" /> 
<input type="checkbox" name="foo[]" value="2" /> 

Luego, cuando el usuario envía el formulario, el servidor puede analizar cuál de las casillas de verificación se comprobaron mediante la comprobación de los valores de la matriz foo[]. El valor de la casilla de verificación no cambia si está marcado o no; el navegador simplemente no envía los valores de las casillas de verificación no verificadas al servidor. Si lo haces, por ej. $('#your-form').serialize() en jQuery, debería funcionar de manera similar; no debe incluir valores de casillas de verificación no verificadas. Si omite el valor de la casilla de verificación, simplemente se establece de manera predeterminada en on.

Si desea comprobar si una casilla individual está marcada o no en jQuery, la mejor manera más descriptiva es hacer $(this).is(':checked')

+1

Bien. Eso tiene sentido. Jees. Me he abstraído de HTML durante tanto tiempo debido a asp.net Olvidé los conceptos básicos de cómo funcionan las casillas de verificación. –

+4

Usted sabe tanto como yo entiendo esto, todavía creo que un enfoque más intuitivo sería devolver verdadero o falso. Siempre puedes usar 'attr ('value')' si eso es lo que quieres. Parece derrotar el propósito de la abstracción. –

+1

@jamietre esta es su propia visión de la abstracción ... si val() devolviera el valor de las entradas de texto y el estado verificado de las entradas de la casilla de verificación, probablemente lloraría y dejaría de usar jQuery :-) – Capsule

5

Tal vez esto debería ayudar

$(document).ready(function() { 
    $('input[type=checkbox]').click(function() { 
     alert("val="+$(this).val()+",checked="+$(this).attr('checked')); 
    }); 

}); 

Uso input[type=checkbox] para seleccionar la casilla de verificación input type="checkbox" ya es y de entrada con type = "casilla de verificación"

Y atributo de valor también puso a casilla de verificación.

En jsfiddle

ACTUALIZACIÓN

<form method="post" action="#"> 
    PHP<input type="checkbox" name="ch[]" value="PHP"><br/> 
    JS<input type="checkbox" name="ch[]" value="JS"><br/> 
    JAVA<input type="checkbox" name="ch[]" value="JAVA"><br/> 
    PYTHON<input type="checkbox" name="ch[]" value="PYTHON"><br/> 
    <input type="submit" name="submit"/> 
</form> 

y PHP

if($_POST){ 
foreach($_POST['ch'] as $post => $value){ 
    echo "$post -> $value <br/>"; 
} 
} 

Todos ellos comparten mismo nombre, ya que son un grupo común de botón. Usted sabe cuál fue verificado y cuál no a través de sus valores.

La otra forma es

if($_POST){ 
    foreach($_POST as $post => $value){ 
     echo "$post -> $value <br/>"; 
    } 
} 

<form method="post" action="#"> 
    PHP<input type="checkbox" name="PHP"><br/> 
    JS<input type="checkbox" name="JS"><br/> 
    JAVA<input type="checkbox" name="JAVA"><br/> 
    PYTHON<input type="checkbox" name="PYTHON"><br/> 
    <input type="submit" name="submit"/> 
</form> 

Pero el anterior parece añadir más dinámico y menos tedioso (creería).

Y en cuanto a la pregunta de la cápsula @

alert("val="+$(this).val()+",checked="+$(this).attr('checked')); 
<input type="checkbox"> Check me. 

devuelve el valor on Creo que es el valor por defecto de la casilla de verificación.

Y el segundo experimento también da el valor on.

Espero no estar equivocado.

+0

He vinculado la versión incorrecta del violín, lo siento, se ha solucionado. Hace lo que digo que hace. –

+0

Bien, claro, puede agregar un atributo de "valor" a una casilla de verificación y lo devolverá. ¿Por qué es útil o intuitivo, ya que es un control de entrada? Los DATOS reales de una casilla de verificación que cambia, es el estado de la casilla de verificación. Si agrega un atributo de "valor" a un área de texto, por ejemplo, 'val()' todavía devuelve el contenido del área de texto, lo cual es lógico. El comportamiento es inconsistente. –

+0

@jamietre Vea las otras respuestas, hay muchos otros usos donde una casilla TIENE que tener un valor – Capsule

1

Una casilla de verificación no es siempre solo y se pasa a su valor al presentar el formulario (de lo contrario , el nombre/valor no se pasa en absoluto).

Es muy útil al hacer matrices fuera de casillas de verificación, puede usar name="test[]" como su nombre, y establecer valores diferentes en cada una. Al analizar el resultado enviado, termina con una matriz que contiene todos los valores marcados

1

La casilla de verificación tiene un valor igual que el cuadro de texto y este valor se envía al servidor cuando el formulario se envía solo si se seleccionó la casilla tiempo de presentación.

A diferencia de cuadro de texto, casilla de verificación tiene valor predeterminado que es on - esto se envía al servidor cuando se selecciona la casilla de verificación, pero no tiene value de su propia, por lo que el código de procesamiento puede saber que fue seleccionado.

Así que el método .val() está funcionando bien, devolviendo el valor del elemento.

Tiene razón en que a jQuery le falta una forma simple de ver si se selecciona una casilla de verificación/botón de opción específico, algo así como $("#mycheckbox").checked(), pero para eso tenemos plugins. :)

7

Usted dice que "las casillas de verificación no tienen ningún atributo value". Por el contrario: el atributo value es opcional excepto en casillas de verificación y casillas de radio.

De the W3C specifications:

[el atributo value] es opcional, excepto cuando el atributo type tiene el valor "radio" o "casilla de verificación"

on es el valor por defecto que su navegador le da el elemento cuando ignora la especificación y no establece un atributo value.

Debe recordar lo que significa el valor: se envía con el name del elemento al servidor cuando se envía el formulario. Si no está marcado, el valor no se envía. Por lo tanto, el valor on solo se envía cuando la casilla de verificación está marcada.

+0

+1 Aprendemos algo nuevo todos los días. Gracias, un solo día. Esto es gracioso. He estado trabajando en los años web pero nunca consideré leer las especificaciones del W3C para las casillas de verificación, o tengo interés en investigar de dónde vino el "encendido", aunque se me pasó por la mente la extraña ocasión. (He pasado por muchas otras especificaciones W3C aunque ...) Ahora lo sé. ¡Tiene sentido! Y ahora, para algo completamente diferente –

3

Si pasa una matriz a la función val, establecerá la casilla de verificación como marcada si el valor de la casilla de verificación coincide con el valor de la matriz. Fuente: http://api.jquery.com/val/#val-value

<input id="checkbox" type="checkbox" value="remember">  

$("#checkbox").val(["remember"]); 
+0

, siento lo mismo que @Jamie Treworgy: los valores predeterminados de verdadero o falso tendrían infinitamente más sentido. – Suncat2000

Cuestiones relacionadas