web-dev-qa-db-ger.com

Wie kann ich ein Optionsfeld deaktivieren?

Ich habe eine Gruppe von Optionsfeldern, die ich deaktivieren möchte, nachdem ein AJAX Formular mit jQuery gesendet wurde. Ich habe folgende Funktion:

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

Mit Hilfe dieser Funktion kann ich die Werte in den Textfeldern löschen, aber ich kann die Werte der Optionsfelder nicht löschen.

Übrigens habe ich auch $(this).val(""); ausprobiert, aber das hat nicht funktioniert.

446
systemsfault

entweder (plain js)

this.checked = false;

oder (jQuery)

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

Siehe jQuery prop () - Hilfeseite für eine Erklärung des Unterschieds zwischen attr () und prop () und warum prop () jetzt vorzuziehen ist.
prop () wurde im Mai 2011 mit jQuery 1.6 eingeführt.

686
David Hedlund

Sie würden die Funktion each nicht benötigen

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

Oder

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

Das gleiche sollte auch für Ihre Textbox gelten:

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

Aber du könntest das verbessern

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

Versuchen

$(this).removeAttr('checked')

Da viele Browser 'checked = anything' als wahr interpretieren. Dadurch wird das aktivierte Attribut vollständig entfernt.

Hoffe das hilft.

29
cjstehno

Leichte Modifikation von Laurynas 'Plugin basierend auf Igor's Code. Dies bietet Platz für mögliche Beschriftungen, die den Optionsfeldern zugeordnet sind, auf die abgezielt wird:

(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
alkos333

Danke Patrick, du hast meinen Tag gemacht! Es ist mousedown, den Sie benutzen müssen. Ich habe den Code jedoch verbessert, damit Sie mit einer Gruppe von Optionsfeldern umgehen können.

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

Umschreiben von Igor's Code als Plugin.

Verwenden:

$('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
Laurynas

Für Radio und Radiogruppe:

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

Versuchen Sie dies, dies wird den Trick machen:

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

Versuchen

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

Sie können das Verhalten der Radiobuttons auch nur mit Hilfe von Kontrollkästchen simulieren:

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

Dann können Sie diesen einfachen Code verwenden, um für Sie zu arbeiten:

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

Es funktioniert einwandfrei und Sie haben mehr Kontrolle über das Verhalten der einzelnen Tasten.

Sie können es selbst ausprobieren unter: http://jsfiddle.net/almircampos/n1zvrs0c/

Mit dieser Abzweigung können Sie auch alle in einem Kommentar angeforderten Elemente abwählen: http://jsfiddle.net/5ry8n4f4/

9
Almir Campos

Geben Sie einfach den folgenden Code für jQuery ein:

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

Und für Javascript:

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

Es ist nicht notwendig, eine foreach-Schleife, .each () -Funktion oder irgendetwas anderes zu setzen

6
Jitendra Damor

Benutze das

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

Sie können diese JQuery verwenden, um das Optionsfeld "Deaktivieren" zu deaktivieren

$('input:radio[name="IntroducerType"]').removeAttr('checked');
                $('input:radio[name="IntroducerType"]').prop('checked', false);
4
keivan kashani
$('#frm input[type="radio":checked]').each(function(){
   $(this).checked = false;  
  });

Das ist fast gut, aber du hast die [0] verpasst

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

4
alecellis1985
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
Menotti