Jak odznaczyć przycisk radiowy?

Mam grupę przycisków radiowych, które chcę odznaczyć po przesłaniu formularza AJAX za pomocą jQuery. Mam następującą funkcję:

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

Za pomocą tej funkcji mogę wyczyścić wartości w polach tekstowych, ale nie mogę wyczyścić wartości przycisków opcji.

Przy okazji, ja też próbowałem, ale to nie zadziałało.
Author: Gregg Bursey, 2010-01-22

16 answers

Albo (zwykły js)

this.checked = false;

Lub (jQuery)

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

Zobacz Strona pomocy jQuery prop() dla wyjaśnienia różnicy pomiędzy attr () i prop () i dlaczego prop() jest teraz preferowany.
prop() został wprowadzony w jQuery 1.6 W maju 2011 roku.

 646
Author: David Hedlund,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-08-09 13:21:13

Nie potrzebujesz funkcji each

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

Lub

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

To samo powinno dotyczyć również twojego pola tekstowego:

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

Ale mógłbyś to poprawić

$('#frm input:text').val("");
 81
Author: James Wiseman,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-01-22 13:49:13

Try

$(this).removeAttr('checked')

Ponieważ wiele przeglądarek zinterpretuje 'checked = anything' jako true. Spowoduje to całkowite usunięcie atrybutu checked.

Mam nadzieję, że to pomoże.
 29
Author: cjstehno,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-01-22 13:49:13

Niewielka modyfikacja wtyczki Laurynas na podstawie kodu Igora. Dotyczy to możliwych etykiet powiązanych z kierowanymi przyciskami radiowymi:

(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);
 20
Author: alkos333,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-11-30 14:40:20

Przepisanie kodu Igora jako wtyczki.

Użycie:

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

Plugin:

(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 );
 17
Author: Laurynas,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-09-18 13:56:24

Dzięki Patrick, sprawiłeś mi dzień! Musisz użyć mousedown. Jednak poprawiłem kod, dzięki czemu można obsługiwać grupę przycisków radiowych.

//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;
    }
}})());
 17
Author: igor,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-05-30 07:58:05

Dla Radia i Grupy Radiowej:

$(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');
        }
    });
});
 15
Author: Sylvain Kocet,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-10-30 11:49:51

Spróbuj tego, to zadziała:

        $(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
                }
            });
        });
 13
Author: Patrick Rietveld,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-10-01 11:02:11

Try

$(this).attr("checked" , false );
 10
Author: rahul,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-01-22 13:47:03

Można również symulować zachowanie radiobutton używając tylko pól wyboru:

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

Następnie możesz użyć tego prostego kodu do pracy dla Ciebie:

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

Działa dobrze i masz większą kontrolę nad zachowaniem każdego przycisku.

Możesz spróbować samodzielnie pod adresem: http://jsfiddle.net/almircampos/n1zvrs0c/

Ten widelec pozwala również usunąć zaznaczenie WSZYSTKICH zgodnie z życzeniem w komentarzu: http://jsfiddle.net/5ry8n4f4/

 7
Author: Almir Campos,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-06-30 14:38:49

Wystarczy umieścić następujący kod dla jQuery:

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

I dla javascript:

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

Nie ma potrzeby umieszczania żadnej pętli foreach , .each () fubction or any thing

 5
Author: Jitendra Damor,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-04-09 11:21:46
$('#frm input[type="radio":checked]').each(function(){
   $(this).checked = false;  
  });

To jest prawie dobre, ale przegapiłeś [0]

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

 4
Author: alecellis1985,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2013-12-20 18:55:23

Użyj tego

$("input[name='nameOfYourRadioButton']").attr("checked", false);
 3
Author: CrsCaballero,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-06-14 15:17:19
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" >

: D

 1
Author: Menotti,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-06-16 14:43:00
$('input[id^="rad"]').dblclick(function(){
    var nombre = $(this).attr('id');
    var checked =  $(this).is(":checked") ;
    if(checked){
        $("input[id="+nombre+"]:radio").prop( "checked", false );
    }
});

Za każdym razem, gdy masz podwójne kliknięcie w sprawdzonym radiu, zaznaczone zmienia się na false

Moje radia zaczynają się od id=radxxxxxxxx ponieważ używam tego selektora id.

 -2
Author: Eduardo Andres Mesa Caceres,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-09-23 09:16:21
function clearForm(){
  $('#frm input[type="text"]').each(function(){
      $(this).val("");  
  });
  $('#frm input[type="radio"]:checked').each(function(){
      $(this).attr('checked', false);  
  });
 }

Prawidłowy selektor to: #frm input[type="radio"]:checked nie #frm input[type="radio":checked]

 -2
Author: Save,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-09-23 11:29:28