Presta atención porque en esta división vas a hallar el resultado que buscas.
Solución:
He ampliado las sugerencias anteriores. Esto funciona para mí, con varias radios acopladas por el mismo nombre.
$("input[type='radio']").click(function()
var previousValue = $(this).attr('previousValue');
var name = $(this).attr('name');
if (previousValue == 'checked')
$(this).removeAttr('checked');
$(this).attr('previousValue', false);
else
$("input[name="+name+"]:radio").attr('previousValue', false);
$(this).attr('previousValue', 'checked');
);
Si todo lo que quiere hacer es tener una casilla de verificación que marque, no se preocupe por hacerlo con JQuery. Esa es la funcionalidad predeterminada de una casilla de verificación al hacer clic. Sin embargo, si desea hacer cosas adicionales, puede agregarlas con JQuery. Antes de jQuery 1.9, puede usar use $(this).attr('checked');
para obtener el valor en lugar de $(this).attr('checked', true);
ya que el segundo establecerá el valor.
Aquí hay una demostración de violín que muestra la funcionalidad de la casilla de verificación predeterminada frente a lo que está haciendo con JQuery.
Nota: Después de JQuery 1.6Deberías usar $(this).prop;
en vez de $(this).attr
en los tres lugares (gracias @Whatevo por señalar esto y consulte aquí para obtener más detalles).
ACTUALIZAR:
Lo siento, se me pasó el requisito de que tenía que ser un botón de radio. Es posible que aún desee considerar la casilla de verificación, pero aquí está el código actualizado para la versión de entrada de radio. Funciona configurando el previousValue
como un attribute en la casilla de verificación, ya que no creo prop
es compatible con 1.3.2. También puede hacer esto en una variable con ámbito, ya que a algunas personas no les gusta establecer valores aleatorios attributes en campos Aquí está el nuevo ejemplo.
ACTUALIZACIÓN 2:
Como señaló Josh, la solución anterior solo funcionaba con un botón de opción. Aquí hay una función que hace que un grupo de radios no se pueda seleccionar por su nombre y un violín:
var makeRadiosDeselectableByName = function(name)
$('input[name=' + name + ']').click(function()
if($(this).attr('previousValue') == 'true')
$(this).attr('checked', false)
else
$('input[name=' + name + ']').attr('previousValue', false);
$(this).attr('previousValue', $(this).attr('checked'));
);
;
En lugar de obtener el valor marcado, lo está configurando con:
var checked = $(this).attr('checked', true);
Para obtenerlo correctamente:
var checked = $(this).attr('checked');
Una solución de trabajo (con múltiples botones de opción que tienen diferentes valores):
// select radio buttons group (same name)
var radioButtons = $("input[type='radio'][name='rr']");
// save initial ckecked states
var radioStates = ;
$.each(radioButtons, function(index, rd)
radioStates[rd.value] = $(rd).is(':checked');
);
// handle click event
radioButtons.click(function()
// check/unchek radio button
var val = $(this).val();
$(this).prop('checked', (radioStates[val] = !radioStates[val]));
// update other buttons checked state
$.each(radioButtons, function(index, rd)
if(rd.value !== val)
radioStates[rd.value] = false;
);
);
PD:$().attr
debe usarse en lugar de $().prop
para jquery <1.6