jQuery सेट रेडियो बटन


134

मैं एक रेडियो बटन सेट करने की कोशिश कर रहा हूं। मैं मूल्य या आईडी का उपयोग करके इसे सेट करना चाहता हूं।

यही मैंने कोशिश की है।

$('input:radio[name=cols]'+" #"+newcol).attr('checked',true);

newcol रेडियो बटन की आईडी है।

हो सकता है कि थोड़ा संपादन क्रम में हो।

रेडियो बॉक्स के दो सेट होते हैं जिनमें से एक कोल्स के साथ और दूसरा पंक्तियों के साथ। तो मैं आईडी का उपयोग नहीं करने में बिंदु को देखता हूं। मेरी गलती। इसलिए मेरे पास एक उदाहरण है:

<input type="radio" name="rows" class="listOfCols" 
   style="width: 50%; " value="Site"></input>

तथा

<input type="radio" name="cols" class="listOfCols" 
   style="width: 50%; "  value="Site"></input>

आईडी हटाए जाने के साथ, और मुझे सही सेट करने की आवश्यकता है।


जवाबों:


196

आपका चयनकर्ता input:radio[name=cols]उस तत्व के वंशज की तलाश करता है जिसके पास आईडी newcol(उस चर का मूल्य) है।

इसके बजाय इसे आज़माएं (चूंकि आप वैसे भी आईडी द्वारा चयन कर रहे हैं):

$('#' + newcol).prop('checked',true);

यहाँ एक डेमो है: http://jsfiddle.net/jasper/n8CdM/1/

इसके अलावा, jQuery के 1.6 के रूप में एक संपत्ति को बदलने की perferred विधि है .prop(): http://api.jquery.com/prop


5
propबनाम के लिए +1 attrattrगुण के लिए पदावनत और अब jQuery 2.0 में काम नहीं करते))
gavenkoa

87

मुझे यहाँ उत्तर मिला:
https://web.archive.org/web/20160421163524/http://vijayt.com/Post/Set-RadioButton-value-use-jQuery

मूल रूप से, यदि आप एक रेडियो बटन की जांच करना चाहते हैं, तो आपको एक सरणी के रूप में मान पास करना होगा:

$('input:radio[name=cols]').val(['Site']);
$('input:radio[name=rows]').val(['Site']);

नमस्कार उस लिंक में कोई सुझावित सामग्री नहीं है। आप लोग लिंक हटाने के लिए मेरे संपादन को अस्वीकार क्यों कर रहे हैं इसमें कुछ भी बात शामिल नहीं है।
मेनुका इशान

@ मेनुइशन, बिंदु है: श्रेय देना। लिंक web.archive.org में उपलब्ध है, और उस व्यक्ति ने जिसने इसे पहली बार लिखा था और जिससे मुझे उत्तर का विचार आया, उसे इसका क्रेडिट प्राप्त करना होगा। लिंक को न निकालें, और यदि आप मूल पोस्ट देखना चाहते हैं, तो लिंक को कॉपी और पेस्ट करें (मुझे नहीं पता कि यह web.archive.org के बजाय पुराने पेज पर क्यों जा रहा है)
चोकोक्रोक

2
@Chococroc आपने प्रश्न के मार्कडाउन को सही ढंग से कॉन्फ़िगर नहीं किया है। मैंने वेब संग्रह संस्करण देखा और इसे सही ढंग से जोड़ा। समीक्षा के बाद यह सही ढंग से साइट से लिंक होगा।
मेनुका इशान

2
ऐसा लगता है जैसे यह स्वीकार किया गया उत्तर होना चाहिए क्योंकि यह jQuery डॉक्स
plong0

15

अपने चयनकर्ता में आप किसी दिए गए आईडी के साथ अपने रेडियो बटन के कुछ नेस्टेड तत्व लाने का प्रयास कर रहे हैं। यदि आप एक रेडियो बटन की जांच करना चाहते हैं, तो आपको चयनकर्ता में इस रेडियो बटन का चयन करना चाहिए, न कि कुछ और:

$('input:radio[name="cols"]').attr('checked', 'checked');

यह मानता है कि आपके मार्कअप में निम्नलिखित रेडियो बटन हैं:

<input type="radio" name="cols" value="1" />

यदि आपके रेडियो बटन में एक आईडी थी:

<input type="radio" name="cols" value="1" id="myradio" />

आप सीधे एक आईडी चयनकर्ता का उपयोग कर सकते हैं:

$('#myradio').attr('checked', 'checked');

यदि colsनाम के साथ कई रेडियो हैं तो $('input:radio[name="cols"]').attr('checked', 'checked');अंतिम एक का चयन करेंगे। यह प्रत्येक पर कोड चलाएगा, लेकिन हर बार जब आप checkedसंपत्ति सेट करते हैं, तो पहले से सेट किया गया तत्व परेशान हो जाता है। यहाँ एक डेमो है: jsfiddle.net/jasper/n8CdM/2
जैस्पर

@ जैस्पर, हां, यह सच है। यही कारण है कि मैंने एक आईडी चयनकर्ता का उपयोग करने का सुझाव दिया।
डारिन दिमित्रोव

12

आप निम्न कोड आज़मा सकते हैं:

$("input[name=cols][value=" + value + "]").attr('checked', 'checked');

यह निर्दिष्ट के रूप में रेडियो कॉलम और मूल्य के लिए जाँच की विशेषता निर्धारित करेगा।


1
...the most important concept to remember about the checked attribute is that it does not correspond to the checked property.स्रोत: api.jquery.com/attr
जैस्पर

10

आपको क्यों चाहिए 'input:radio[name=cols]'? अपना html नहीं जानते, लेकिन यह मानते हुए कि आईडी अद्वितीय हैं, आप बस ऐसा कर सकते हैं।

$('#'+newcol).prop('checked', true);

6

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

$("#" + newcol).attr("checked", "checked");

मेरे पास समस्याएं हैं attr("checked", true), इसलिए मैं इसके बजाय उपरोक्त का उपयोग करता हूं।

इसके अलावा, अगर आपके पास आईडी है तो आपको चयन के लिए अन्य सामान की आवश्यकता नहीं है। एक आईडी अद्वितीय है।


1
प्रोप इस तरह चीजों के लिए attr से बेहतर है
RozzA

attr jQuery 1.9+ प्रोप के उपयोग में चला गया है।
माइक_लेयर

आप सही हैं, लेकिन अंततः यह आपकी विशिष्ट स्थिति पर निर्भर करता है। यदि आपका कोड हमेशा jQuery 1.6+ के साथ चल रहा होगा, तो प्रोप जाने का रास्ता है। लेकिन अगर आपका कोड पुराने संस्करणों पर चल रहा है तो समाधान उतना सरल नहीं है। उदाहरण के लिए, मैं jQuery के पिकलिस्ट प्लगइन को बनाए रखता हूं, और हम jQuery 1.4+ का समर्थन करते हैं, इसलिए केवल प्रोप का उपयोग करना एक विकल्प नहीं है। यह एक खुला टिकट है, इसलिए यदि आपके पास कोई सुंदर सुझाव है तो मैं उन्हें सुनना पसंद करूंगा; मेरे पास अभी तक शोध करने का समय नहीं है।
अवनी भालू

समस्या यह है कि भले ही आपका समाधान अधिक पिछड़ा-संगत हो सकता है, बस इस मामले में काम नहीं करता है: ए का चयन करें, यह नई checked="checked"विशेषता प्राप्त करेगा और ब्राउज़र इसे चेक के रूप में दिखाएगा, फिर बी चुनें और ऐसा ही होगा। अब जब आप A का चयन करेंगे तो उसमें पहले से ही checked="checked"विशेषता होगी और कुछ भी नहीं बदलेगा। उस बी के साइड इफेक्ट के रूप में अभी भी चुना जाएगा, ए
क्यबोरक


2

उपयोग करना .filter()भी काम करता है, और आईडी, मूल्य, नाम के लिए लचीला है:

$('input[name="cols"]').filter("[value='Site']").attr('checked', true);

( इस ब्लॉग पर देखा )


1
मेरा मानना ​​है कि यह एक समान रूप से मान्य उत्तर है, लेकिन इसे प्रोप () विधि: $ ('इनपुट [नाम = "कॉल" "]) का उपयोग करना चाहिए। फ़िल्टर (" [मूल्य =' साइट '] ")। प्रोप (' जाँच ') ', सच);। उपयोगकर्ता "मान या आईडी" द्वारा सेट करना चाहता है। ऐसा समय हो सकता है कि आप प्रत्येक रेडियो विकल्प के लिए आईडी मान निर्धारित नहीं करना चाहते हैं, इसलिए नाम से प्राप्त करना और मूल्य द्वारा फ़िल्टर करना उपयोगी है।
Zac Imboden


0

आप बस का उपयोग कर सकते हैं:

$("input[name='cols']").click();

0

चुना हुआ उत्तर इस मामले में काम करता है।

लेकिन सवाल रेडियोग्रुप और डायनेमिक आईडी पर आधारित तत्व को खोजने के बारे में था, और इसका उत्तर प्रदर्शित रेडियो बटन को अप्रभावित छोड़ सकता है।

यह लाइन ठीक उसी तरह का चयन करती है जैसा स्क्रीन पर बदलाव दिखाने के दौरान पूछा गया था।

$('input:radio[name=cols][id='+ newcol +']').click();
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.