Hoe u een keuzerondje uitschakelt?

Ik heb een groep radioetsen die ik wil uitschakelen nadat een AJAX-formulier wordt ingediend met jQuery. Ik heb de volgende functie:

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

Met behulp van deze functie kan ik de waarden op de tekstvakken wissen, maar ik kan de waarden van de keuzeknoppen niet wissen.

Trouwens, ik heb ook geprobeerd $(this).val("");maar dat werkte niet.


Antwoord 1, Autoriteit 100%

hetzij (gewoon JS)

this.checked = false;

of (jQuery)

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

Zie jQuery prop () Help pagina voor een uitleg op de Verschil tussen Attrict () en prop () en waarom prop () nu de voorkeur heeft.
Prop () werd in mei 2011 geïntroduceerd met jQuery 1.6.


Antwoord 2, Autoriteit 12%

U hebt niet de each-functie

nodig

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

of

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

hetzelfde moet ook van toepassing zijn op uw tekstvak:

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

Maar je zou dit kunnen verbeteren

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

Antwoord 3, autoriteit 4%

Probeer

$(this).removeAttr('checked')

Aangezien veel browsers ‘checked=anything’ als waar zullen interpreteren. Hierdoor wordt het aangevinkte kenmerk helemaal verwijderd.

Hopelijk helpt dit.


Antwoord 4, autoriteit 3%

Kleine wijziging van de plug-in van Laurynas op basis van de code van Igor. Dit is geschikt voor mogelijke labels die zijn gekoppeld aan de keuzerondjes die worden getarget:

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

Antwoord 5, autoriteit 3%

Bedankt Patrick, je hebt mijn dag goed gemaakt! Het is mousedown die je moet gebruiken. Ik heb de code echter verbeterd, zodat je een groep keuzerondjes kunt gebruiken.

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

Antwoord 6, autoriteit 2%

Herschrijf de code van Igor als plug-in.

Gebruik:

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

Plug-in:

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

Antwoord 7, autoriteit 2%

Voor radio en radiogroep:

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

Antwoord 8, autoriteit 2%

Probeer dit, dit zal het lukken:

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

Antwoord 9

Probeer

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

Antwoord 10

Je kunt het gedrag van de keuzerondjes ook simuleren met alleen selectievakjes:

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

Dan kunt u deze eenvoudige code gebruiken om voor u te werken:

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

Het werkt prima en je hebt meer controle over het gedrag van elke knop.

Je kunt het zelf proberen op: http://jsfiddle.net/almircampos/n1zvrs0c/

Met deze vork kun je ook alles deselecteren zoals gevraagd in een opmerking:
http://jsfiddle.net/5ry8n4f4/


Antwoord 11

Voer gewoon de volgende code in voor jQuery:

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

En voor javascript:

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

Het is niet nodig om een foreach-lus, .each()-functie of iets anders te plaatsen


Antwoord 12

Gebruik dit

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

Antwoord 13

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

Dit is bijna goed, maar je hebt de [0]

. gemist

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


Antwoord 14

U kunt deze JQuery gebruiken om de keuzerondjes uit te schakelen

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

Antwoord 15

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" >

😀


Antwoord 16

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

Elke keer dat u dubbelklikt in een aangevinkte radio, verandert de aangevinkte optie in false

Mijn radio’s beginnen met id=radxxxxxxxxomdat ik deze id-selector gebruik.


Antwoord 17

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

De juiste selector is: #frm input[type="radio"]:checked
niet #frm input[type="radio":checked]

Other episodes