रेडियो बटन को अनचेक कैसे करें?

Question

मेरे पास रेडियो बटनों का समूह है जिसे मैं jQuery का उपयोग करके AJAX फॉर्म सबमिट करने के बाद अनचेक करना चाहता हूं। मेरा निम्नलिखित कार्य है:

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

इस फ़ंक्शन की मदद से, मैं टेक्स्ट बॉक्स पर मान साफ़ कर सकता हूं, लेकिन मैं रेडियो बटन के मूल्यों को साफ़ नहीं कर सकता।

वैसे, मैंने भी कोशिश की $(this).val("");लेकिन वह काम नहीं किया।

Comments

आपको प्रत्येक फ़ंक्शन की आवश्यकता नहीं होगी। आप बस उस फ़ंक्शन को कॉल कर सकते हैं जिसे आप jQuery ऑब्जेक्ट पर चाहते हैं। मेरा जवाब नीचे देखें

— जेम्स विजमैन

प्रत्येक () फ़ंक्शन .. jQuery ("इनपुट: रेडियो") की कोई आवश्यकता नहीं है। RemoveAttr ("जाँच");

— जितेंद्र डामोर

Answer 1

या तो (सादे js)

this.checked = false;

या (jQuery)

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

अटारी () और प्रोप () और क्यों प्रोप () के बीच अंतर पर एक स्पष्टीकरण के लिए jQuery के प्रोप () सहायता पृष्ठ को देखें । मई 2011 में jQuery 1.6 के साथ प्रोप () पेश किया गया था।

Comments

PPL, ध्यान रखें कि उसका व्यवहार 1.6 के पक्ष में बदल रहा है prop(), जबकि .attr()वास्तविक विशेषताओं तक सीमित रहेगा

— Fabiano Soriani

तो क्या यहां सादे जेएस का उपयोग करना सबसे अच्छा है?

— डग मोलिनक्स

@Pete: मैं कहूंगा कि यदि आपके पास jQuery पर बनाया गया सिस्टम है, तो अतिरिक्त लाभ जो आपको देता है वह यह है कि अगर कभी कोई ब्राउज़र होता है जो इसे अलग तरीके से हैंडल करता है, तो आप लाइब्रेरी को ब्राउज़र समर्थन सौंपने में सक्षम होंगे। हालाँकि, यदि आपका सॉफ़्टवेयर वर्तमान में jQuery का उपयोग नहीं करता है, तो यह वास्तव में इसके लिए लाइब्रेरी को शामिल करने के लिए ओवरहेड के लायक नहीं होगा।

— डेविड हेडलंड

@ डेविड हेडलंड: मुझे लगता है कि आप यह अनुमान लगा रहे हैं कि सभी प्रमुख ब्राउज़र आज की तरह ही इसे संभाल रहे हैं, है ना?

— शॉन

@qris: आपकी समस्या शायद कहीं और है। सरल डेमो, jQuery 1.9 का उपयोग कर । यकीन है कि मेरे क्रोम में काम करता है

— डेविड हेडलंड

Answer 2

आपको eachफ़ंक्शन की आवश्यकता नहीं होगी

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

या

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

वही आपके टेक्स्टबॉक्स पर भी लागू होना चाहिए:

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

लेकिन आप इसे सुधार सकते हैं

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

Comments

.removeAttr में समस्याएं होने की संभावना है।

— 21

कैसे पर विस्तार करने के लिए देखभाल? या एक लिंक प्रदान करें?

— जेम्स वाइसमैन

हां, कजकाई, मुझे भी उत्सुकता है कि मेरा उत्तर इसके लिए भी नीचे दिया गया था। प्रलेखन में किसी जोखिम का उल्लेख नहीं है।

— cjstehno

प्रासंगिक दस्तावेज़ीकरण वास्तव में .prop () विधि: api.jquery.com/prop उद्धरण "गुण आमतौर पर क्रमबद्ध HTML विशेषता को बदले बिना DOM तत्व की गतिशील स्थिति को प्रभावित करता है। उदाहरणों में इनपुट तत्वों के मूल्य गुण, अक्षम संपत्ति शामिल हैं। इनपुट और बटन, या एक चेकबॉक्स की जाँच की गई संपत्ति। .prop () विधि को .attr () विधि के बजाय अक्षम और चेक करने के लिए उपयोग किया जाना चाहिए। मूल्य प्राप्त करने और सेट करने के लिए .val () विधि का उपयोग किया जाना चाहिए। । " इसका मतलब यह है कि ...

— कज़कई

... इसका मतलब यह है कि .attr () .prop () की तुलना में एक अलग अंतर्निहित स्रोत को बदल देगा, DOM के बजाय क्रमबद्ध html विशेषता, और जबकि यह अब संगत हो सकता है (जैसे jQuery 1.9 जब .attr दोनों को संशोधित कर सकता है। () का उपयोग किया जाता है), यह कोई गारंटी नहीं है कि यह भविष्य में दोनों को संशोधित करने के लिए अपकमिंग होगा जब .prop () कैनोनिकल है। उदाहरण के लिए, यदि आप .attr ('चेक किया हुआ', गलत) का उपयोग करते हैं; और आपके द्वारा उपयोग की जाने वाली लाइब्रेरी में .prop ('चेक किया हुआ', सही) ;, एक अंतर्निहित संघर्ष होने वाला है जो कष्टप्रद बग पैदा कर सकता है।

— काज़काई

Answer 3

प्रयत्न

$(this).removeAttr('checked')

चूंकि बहुत सारे ब्राउज़र 'चेक किए गए = कुछ भी' को सही मानेंगे। यह पूरी तरह से जाँच की गई विशेषता को हटा देगा।

उम्मीद है की यह मदद करेगा।

Comments

इसके अलावा, अन्य उत्तरों में से एक के रूप में, आपको प्रत्येक फ़ंक्शन की आवश्यकता नहीं होगी; आप बस चयनकर्ता को हटाने के लिए कॉल कर सकते हैं।

— cjstehno

नोट: यह प्रतिक्रिया 2010 से है। उस समय, यह एक मान्य और स्वीकृत दृष्टिकोण था। तब से यह पदावनत हो गया।

— cjstehno

Answer 4

इगोर के कोड के आधार पर लॉरेंस के प्लगइन का थोड़ा संशोधन। यह रेडियो बटन से जुड़े संभावित लेबल को लक्षित करता है:

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

Comments

यह इस बात पर निर्भर करता है कि लेबल का उपयोग कैसे किया जाता है, यदि वे आईडी का उपयोग करते हैं तो यह कोड काम करता है, अगर लेबल में रेडियो बटन नेस्टेड नहीं है। आप इसे और भी अधिक उन्नत संस्करण का उपयोग कर सकते हैं: gist.github.com/eikes/9484101

— eikes

Answer 5

धन्यवाद पैट्रिक, आपने मेरा दिन बना दिया! यह आप का उपयोग करने के लिए mousedown है। हालाँकि मैंने कोड में सुधार किया है ताकि आप रेडियो बटन के एक समूह को संभाल सकें।

//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 6

प्लगइन के रूप में इगोर के कोड को फिर से लिखना।

उपयोग:

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

लगाना:

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

Comments

यदि मैं लेबल पर क्लिक कर रहा हूं तो अनसेलेक्टिंग काम नहीं करता है। इसलिए जब लेबल पर क्लिक करके किसी रेडियो का चयन करना संभव हो जाता है, तो केवल वेब बटन पर क्लिक करके केवल काम करता है।

— साइमन हुरलिमन

@ alkos333 में एक समाधान है जो लेबल के साथ भी काम करता है।

— साइमन हरलीमन्न

यह इस बात पर निर्भर करता है कि लेबल का उपयोग कैसे किया जाता है, यदि वे आईडी का उपयोग करते हैं तो @ alkos333 कोड काम करता है, यदि लेबल में रेडियो बटन नेस्टेड है, तो इस संस्करण का उपयोग करें: gist.github.com/eikes/9484101

— eA

Answer 7

रेडियो और रेडियो समूह के लिए:

$(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 8

यह कोशिश करो, यह चाल होगी:

        $(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 9

प्रयत्न

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

Answer 10

आप केवल चेकबॉक्स का उपयोग करके रेडियोबॉटन व्यवहार का अनुकरण भी कर सकते हैं:

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

फिर, आप इस सरल कोड का उपयोग आपके लिए काम कर सकते हैं:

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

यह ठीक काम करता है और आप प्रत्येक बटन के व्यवहार पर अधिक नियंत्रण रखते हैं।

आप इसे स्वयं पर आज़मा सकते हैं: http://jsfiddle.net/almircampos/n1zvrs0c/

यह कांटा भी आप सभी को एक टिप्पणी में अनुरोध के रूप में अचयनित करते हैं: http://jsfiddle.net/5ry8n4f4/

Comments

यह बहुत अच्छा है, सिवाय इसके कि आप सभी बक्से को अनचेक नहीं कर सकते।

— स्टीफन

Answer 11

बस jQuery के लिए निम्नलिखित कोड डाल:

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

और जावास्क्रिप्ट के लिए:

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

किसी भी फॉर्च लूप, .each () फ़्यूबेशन या किसी भी चीज़ को लगाने की कोई आवश्यकता नहीं है

Answer 12

इसे इस्तेमाल करो

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

Answer 13

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

यह लगभग अच्छा है लेकिन आप चूक गए [0]

सही - >> $(this)[0].checked = false;

Comments

या बस:this.checked = false;

— eikes

Answer 14

आप इस JQuery का उपयोग अनियंत्रित रेडियोबोटन के लिए कर सकते हैं

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

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

: डी

Answer 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 );
    }
});

हर बार जब आप चेक किए गए रेडियो में एक डबल क्लिक करते हैं तो चेक किए गए परिवर्तन झूठे हो जाते हैं

मेरा रेडियो शुरू होता है id=radxxxxxxxxक्योंकि मैं इस आईडी चयनकर्ता का उपयोग करता हूं।

Comments

कृपया (समझने योग्य) अंग्रेजी में उत्तर लिखें।

— ericbn

@ericbn क्या होगा अगर कोई अंग्रेजी नहीं जानता है?

— अल्फामेले

@AlphaMale अंग्रेजी इस साइट पर आधिकारिक भाषा है।

— क्रिस्टिक

@ क्रिशिक सभी प्रोग्रामर "अंग्रेजी" बोलने वाले देशों से नहीं आते हैं। इसका मतलब है कि वे इस मंच पर पोस्ट नहीं कर सकते हैं? दूसरी बात, यह 2 साल का है। मुझे ज्ञानवर्धन के लिए धन्यवाद।

— AlphaMale

Answer 17

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

सही चयनकर्ता है: #frm input[type="radio"]:checked नहीं#frm input[type="radio":checked]