Bagaimana menghapus centang tombol radio?

Saya memiliki sekelompok tombol radio yang ingin saya hapus centangnya setelah formulir AJAX dikirimkan menggunakan jQuery. Saya memiliki fungsi berikut:

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

Dengan bantuan fungsi ini, saya dapat menghapus nilai di kotak teks, tetapi saya tidak bisa menghapus nilai tombol radio.

Ngomong-ngomong, saya juga mencoba $(this).val("");tetapi itu tidak berhasil.

salah satu (polos js)

this.checked = false;

atau (jQuery)

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

Lihat halaman bantuan jQuery prop () untuk penjelasan tentang perbedaan antara attr () dan prop () dan mengapa prop () sekarang lebih disukai.
prop () diperkenalkan dengan jQuery 1.6 pada Mei 2011.

Anda tidak akan memerlukan eachfungsinya

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

Atau

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

Hal yang sama juga berlaku untuk kotak teks Anda:

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

Tapi Anda bisa memperbaikinya

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

Mencoba

$(this).removeAttr('checked')

Karena banyak browser akan mengartikan 'checked = anything' sebagai true. Ini akan menghapus semua atribut yang dicentang.

Semoga ini membantu.

Sedikit modifikasi plugin Laurynas berdasarkan pada kode Igor. Ini mengakomodasi kemungkinan label yang terkait dengan tombol radio yang ditargetkan:

(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);

Terima kasih Patrick, kamu membuat hariku! Ini mousedown yang harus Anda gunakan. Namun saya telah meningkatkan kode sehingga Anda dapat menangani sekelompok tombol 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;
    }
}})());

Tulis ulang kode Igor sebagai plugin.

Menggunakan:

$('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 );

Untuk radio dan grup 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');
        }
    });
});

Coba ini, ini akan melakukan trik:

        $(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
                }
            });
        });

Mencoba

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

Anda juga dapat mensimulasikan perilaku tombol radio hanya menggunakan kotak centang:

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

Kemudian, Anda dapat menggunakan kode sederhana ini untuk Anda:

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

Ini berfungsi dengan baik dan Anda memiliki kontrol lebih besar atas perilaku setiap tombol.

Anda dapat mencobanya sendiri di: http://jsfiddle.net/almircampos/n1zvrs0c/

Garpu ini juga memungkinkan Anda membatalkan pilihan semua seperti yang diminta dalam komentar: http://jsfiddle.net/5ry8n4f4/

Masukkan saja kode berikut untuk jQuery:

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

Dan untuk javascript:

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

Tidak perlu meletakkan foreach loop, .each () fubction atau apapun

Gunakan ini

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

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

Ini hampir baik tetapi Anda melewatkan [0]

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

Anda dapat menggunakan JQuery ini untuk menghapus centang radiobutton

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

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

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

Setiap kali Anda memiliki klik dua kali pada radio yang dicentang, perubahan yang dicentang ke false

Radio saya mulai dengan id=radxxxxxxxxkarena saya menggunakan pemilih id ini.

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

Pemilih yang benar adalah: #frm input[type="radio"]:checked tidak#frm input[type="radio":checked]