.prop ('comprobado', falso) o .removeAttr ('comprobado')?

115

Con la introducción del método prop, ahora necesito conocer la forma aceptada de desmarcar una casilla de verificación. Lo es:

$('input').filter(':checkbox').removeAttr('checked');

o

$('input').filter(':checkbox').prop('checked',false);
jquery Phillip Senn
fuente
4
¿Has leído la publicación de John Resig? ejohn.org/blog/jquery-16-and-attr
Jared Farrish

Respuestas:

130

jQuery 3

A partir de jQuery 3, removeAttrya no establece la propiedad correspondiente en false:

Antes de jQuery 3.0, utilizando .removeAttr()un atributo booleano como checked, selectedo readonlypodría también establecer la correspondiente propiedad llamada a false. Este comportamiento era necesario para las versiones antiguas de Internet Explorer, pero no es correcto para los navegadores modernos porque el atributo representa el valor inicial y la propiedad representa el valor actual (dinámico).

Casi siempre es un error utilizarlo .removeAttr( "checked" )en un elemento DOM. La única vez que podría ser útil es si el DOM se va a serializar más adelante en una cadena HTML. En todos los demás casos, .prop( "checked", false )debe usarse en su lugar.

Registro de cambios

Por lo tanto, solo .prop('checked',false)es la forma correcta cuando se usa esta versión.

Respuesta original (de 2011):

Para los atributos que tienen propiedades booleanas subyacentes (de las cuales checkedes uno), removeAttrestablece automáticamente la propiedad subyacente en false. (Tenga en cuenta que esta es una de las "correcciones" de compatibilidad con versiones anteriores agregadas en jQuery 1.6.1).

Entonces, cualquiera funcionará ... pero el segundo ejemplo que dio (usando prop) es el más correcto de los dos. Si su objetivo es desmarcar la casilla de verificación, realmente desea afectar la propiedad , no el atributo, y no es necesario pasar removeAttrpara hacerlo.

John Flatness
fuente
36
@tandu: Usted puede , pero no debe. De los documentos: " Nota: No use [ removeProp()] para eliminar propiedades nativas como marcadas, deshabilitadas o seleccionadas. Esto eliminará la propiedad por completo y, una vez eliminada, no se puede agregar nuevamente al elemento. Use .prop()para establecer estas propiedades en falso en lugar." removePropestá realmente diseñado para usarse solo con propiedades personalizadas.
John Flatness
17

use checked: propiedad verdadera, falsa de la casilla de verificación.

jQuery:

if($('input[type=checkbox]').is(':checked')) {
    $(this).prop('checked',true);
} else {
    $(this).prop('checked',false);
}
suraj rawat
fuente
Podemos eliminar si, de lo contrario, usando un trazador de líneas, $ (this) .prop ('comprobado', $ ('input [type = checkbox]'). Is (': comprobado'));
Yousaf Hassan
8

Recomiendo usar ambos, prop y attr porque tuve problemas con Chrome y los resolví usando ambas funciones. 

if ($(':checkbox').is(':checked')){
    $(':checkbox').prop('checked', true).attr('checked', 'checked');
}
else {
    $(':checkbox').prop('checked', false).removeAttr('checked');
}
Ragnar
fuente
Sí, para cromo, use: $("input[type='checkbox'], input[type='radio']").prop("checked", false).attr("checked", false).removeAttr("checked");
Varilla
Utilizo un componente personalizado (CSS + JS) para reemplazar la radio de entrada y la casilla de verificación. Esta es la única forma que funciona para mí. ¡Gracias!
Silvio Delgado
3

Otra alternativa para hacer lo mismo es filtrar el atributo type = checkbox :

$('input[type="checkbox"]').removeAttr('checked');

o

$('input[type="checkbox"]').prop('checked' , false);

Recuerde que la diferencia entre atributos y propiedades puede ser importante en situaciones específicas. Antes de jQuery 1.6 , el método .attr () a veces tomaba en cuenta los valores de propiedad al recuperar algunos atributos, lo que podía causar un comportamiento inconsistente. A partir de jQuery 1.6, el método .prop () proporciona una forma de recuperar explícitamente valores de propiedad, mientras que .attr () recupera atributos.

Saber más ...

tonnoz
fuente
2
La pregunta era "¿Cuál de estas es más correcta?", No "¿Hay otras formas de hacer esto?". No parece haber intentado responder la pregunta
Andrew Stubbs