javascript - attribute - radio button html checked

¿Cómo desmarcar un botón de radio?

Question

Tengo un grupo de botones de opción que quiero desactivar después de enviar un formulario AJAX utilizando jQuery. Tengo la siguiente función:

function clearForm(){
  $(''#frm input[type="text"]'').each(function(){
      $(this).val("");  
  });
  $(''#frm input[type="radio":checked]'').each(function(){
      $(this).checked = false;  
  });
 }

Con la ayuda de esta función, puedo borrar los valores en los cuadros de texto, pero no puedo borrar los valores de los botones de opción.

Por cierto, también probé $(this).val(""); pero eso no funcionó.

Answer 1

Gracias Patrick, me hiciste el día! Es mousedown que tienes que usar. Sin embargo, he mejorado el código para que pueda manejar un grupo de botones de radio.

//We need to bind click handler as well
//as FF sets button checked after mousedown, but before click
$(''input:radio'').bind(''click mousedown'', (function() {
    //Capture radio button status within its handler scope,
    //so we do not use any global vars and every radio button keeps its own status.
    //This required to uncheck them later.
    //We need to store status separately as browser updates checked status before click handler called,
    //so radio button will always be checked.
    var isChecked;

    return function(event) {
        //console.log(event.type + ": " + this.checked);

        if(event.type == ''click'') {
            //console.log(isChecked);

            if(isChecked) {
                //Uncheck and update status
                isChecked = this.checked = false;
            } else {
                //Update status
                //Browser will check the button by itself
                isChecked = true;

                //Do something else if radio button selected
                /*
                if(this.value == ''somevalue'') {
                    doSomething();
                } else {
                    doSomethingElse();
                }
                */
            }
    } else {
        //Get the right status before browser sets it
        //We need to use onmousedown event here, as it is the only cross-browser compatible event for radio buttons
        isChecked = this.checked;
    }
}})());

Answer 2

Intenta esto, esto hará el truco:

        $(document).ready(function() {
           $("input[type=''radio'']").mousedown(function(e) {
                if ($(this).attr("checked") == true) {
                   setTimeout("$(''input[id=" + $(this).attr(''id'') + "]'').removeAttr(''checked'');", 200);}
                else {
                    return true
                }
            });
        });

Answer 3

Ligera modificación del plugin de Laurynas basado en el código de Igor. Esto acomoda posibles etiquetas asociadas con los botones de radio a los que se dirige:

(function ($) {
    $.fn.uncheckableRadio = function () {

        return this.each(function () {
            var radio = this;
                $(''label[for="'' + radio.id + ''"]'').add(radio).mousedown(function () {
                    $(radio).data(''wasChecked'', radio.checked);
                });

                $(''label[for="'' + radio.id + ''"]'').add(radio).click(function () {
                    if ($(radio).data(''wasChecked''))
                        radio.checked = false;
                });
           });
    };
})(jQuery);

Answer 4

No necesitarías la función de each .

$("input:radio").attr("checked", false);

O

$("input:radio").removeAttr("checked");

Lo mismo debería aplicarse a su cuadro de texto:

$(''#frm input[type="text"]'').val("");

Pero podrías mejorar esto

$(''#frm input:text'').val("");

Answer 5

Para radio y grupo de radio:

$(document).ready(function() {
    $(document).find("input:checked[type=''radio'']").addClass(''bounce'');   
    $("input[type=''radio'']").click(function() {
        $(this).prop(''checked'', false);
        $(this).toggleClass(''bounce'');

        if( $(this).hasClass(''bounce'') ) {
            $(this).prop(''checked'', true);
            $(document).find("input:not(:checked)[type=''radio'']").removeClass(''bounce'');
        }
    });
});

Answer 6

Puedes usar este JQuery para desmarcar el botón de radio

$(''input:radio[name="IntroducerType"]'').removeAttr(''checked'');
                $(''input:radio[name="IntroducerType"]'').prop(''checked'', false);

Answer 7

Reescriba el código de Igor como complemento.

Utilizar:

$(''input[type=radio]'').uncheckableRadio();

Enchufar:

(function( $ ){

    $.fn.uncheckableRadio = function() {

        return this.each(function() {
            $(this).mousedown(function() {
                $(this).data(''wasChecked'', this.checked);
            });

            $(this).click(function() {
                if ($(this).data(''wasChecked''))
                    this.checked = false;
            });
        });

    };

})( jQuery );

Answer 8

Solo pon el siguiente código para jQuery:

jQuery("input:radio").removeAttr("checked");

Y para javascript:

$("input:radio").removeAttr("checked");

No hay necesidad de poner ningún bucle foreach, .each () fubction o cualquier cosa

Answer 9

También puede simular el comportamiento de los botones de radio usando solo casillas de verificación:

<input type="checkbox" class="fakeRadio" checked />
<input type="checkbox" class="fakeRadio" />
<input type="checkbox" class="fakeRadio" />

Luego, puede usar este código simple para trabajar para usted:

$(".fakeRadio").click(function(){
    $(".fakeRadio").prop( "checked", false );
    $(this).prop( "checked", true );
});

Funciona bien y tienes más control sobre el comportamiento de cada botón.

Puede probarlo usted mismo en: http://jsfiddle.net/almircampos/n1zvrs0c/

Esta bifurcación también le permite deseleccionar todo lo solicitado en un comentario: http://jsfiddle.net/5ry8n4f4/

Answer 10

Tratar

$(this).attr("checked" , false );

Answer 11

Tratar

$(this).removeAttr(''checked'')

Dado que muchos navegadores interpretarán ''marcado = cualquier cosa'' como verdadero. Esto eliminará el atributo marcado por completo.

Espero que esto ayude.

Answer 12

Utilizar esta

$("input[name=''nameOfYourRadioButton'']").attr("checked", false);

Answer 13

cualquiera de los dos (llano js)

this.checked = false;

o (jQuery)

$(this).prop(''checked'', false);
// Note that the pre-jQuery 1.6 idiom was
// $(this).attr(''checked'', false);

Consulte la página de ayuda de jQuery prop () para obtener una explicación sobre la diferencia entre attr () y prop () y por qué ahora es preferible prop ().
prop () se introdujo con jQuery 1.6 en mayo de 2011.

Answer 14

$(''#frm input[type="radio":checked]'').each(function(){
   $(this).checked = false;  
  });

Esto es casi bueno, pero te perdiste el [0]

Correcto - >> $(this)[0].checked = false;

Answer 15

$(''input[id^="rad"]'').dblclick(function(){
    var nombre = $(this).attr(''id'');
    var checked =  $(this).is(":checked") ;
    if(checked){
        $("input[id="+nombre+"]:radio").prop( "checked", false );
    }
});

Cada vez que haga doble clic en una radio marcada, los cambios marcados a falso

Mis radios comienzan con id=radxxxxxxxx porque uso este selector de id.

Answer 16

function clearForm(){
  $(''#frm input[type="text"]'').each(function(){
      $(this).val("");  
  });
  $(''#frm input[type="radio"]:checked'').each(function(){
      $(this).attr(''checked'', false);  
  });
 }

El selector correcto es: #frm input[type="radio"]:checked no se #frm input[type="radio":checked]

Answer 17

function setRadio(obj) 
{
    if($("input[name=''r_"+obj.value+"'']").val() == 0 ){
      obj.checked = true
     $("input[name=''r_"+obj.value+"'']").val(1);
    }else{
      obj.checked = false;
      $("input[name=''r_"+obj.value+"'']").val(0);
    }

}

<input type="radio" id="planoT" name="planoT[{ID_PLANO}]" value="{ID_PLANO}" onclick="setRadio(this)" > <input type="hidden" id="r_{ID_PLANO}" name="r_{ID_PLANO}" value="0" >

:RE