JQuery में, मैं उसके नाम विशेषता के द्वारा एक तत्व का चयन कैसे करूं?

Question

मेरे वेब पेज में 3 रेडियो बटन हैं, जैसे नीचे:

<label for="theme-grey">
  <input type="radio" id="theme-grey" name="theme" value="grey" />Grey</label>
<label for="theme-pink">
  <input type="radio" id="theme-pink" name="theme" value="pink" />Pink</label>
<label for="theme-green">
  <input type="radio" id="theme-green" name="theme" value="green" />Green</label>

JQuery में, मैं इन तीनों में से किसी पर क्लिक करने पर चयनित रेडियो बटन का मूल्य प्राप्त करना चाहता हूं। JQuery में हमारे पास id (#) और वर्ग (?) चयनकर्ता हैं, लेकिन क्या होगा अगर मैं नीचे इसके नाम से एक रेडियो बटन ढूंढना चाहता हूं?

$("<radiobutton name attribute>").click(function(){});

कृपया मुझे बताएं कि इस समस्या को कैसे हल किया जाए।

Comments

आपको कड़ाई से 'के लिए' विशेषता निर्दिष्ट करने की आवश्यकता नहीं है, जब तक कि फ़ील्ड को उनके संबंधित 'लेबल' टैग के बीच शामिल नहीं किया जाता है

— लुसिअस

jQuery के 1.8 और इसके बाद के संस्करण इसमें बदलाव किए गए हैं .... मैंने समझाते हुए नीचे एक उत्तर जोड़ा।

— केविन लाब्रान्च

A1rPun का उत्तर सबसे अच्छा है: एक गैर- jQuery का एक-लाइनर!

— रुडी

मेरे जेएस ऐप में राज्य बनाए रखने के लिए एक रेडियो बटन का इस्तेमाल किया। इस धागे की जाँच करने से पहले एक घंटे के लिए डिबग किया जाता है। इसे बाहर की जाँच करें

— प्रशांत

सादे जेएस में:document.querySelectorAll("input:radio[name=theme]").forEach(function() { this.onclick=function() { var value = this.value; }; });

— mplungjan

Answer 1

यह यह करना चाहिए, यह सब प्रलेखन में है , जिसका उदाहरण इसके समान है:

$("input[type='radio'][name='theme']").click(function() {
    var value = $(this).val();
});

मुझे यह भी ध्यान रखना चाहिए कि आपके पास उस स्निपेट में कई समान आईडी हैं। यह अमान्य HTML है। तत्वों का समूह सेट करने के लिए कक्षाओं का उपयोग करें, आईडी नहीं, क्योंकि वे अद्वितीय होने चाहिए।

Comments

@gargantaun - यदि आप एक रेडियो बटन पर क्लिक करते हैं, तो इसका क्या होता है?

— पाओलो बरगिनिनो

अच्छी बात। हालांकि यह अभी भी नहीं है "jQuery में अपने नाम का उपयोग करके चयनित रेडियोबूटन मूल्य कैसे प्राप्त करें?"। यह "jQuery का उपयोग करते समय इस पर क्लिक करने के लिए चयनित रेडियोबॉटन मान कैसे प्राप्त करें?"। एक छोटा सा अंतर, लेकिन एक जिसने मुझे थोड़ा सा चकित कर दिया।

— गरुण

प्रश्न के अनुसार यह उत्तर सही है। वैश्विक दृष्टि से हम क्लेटन के उत्तर के लिए जाते हैं।

— कृष्ण

जिस तरह से jQuery के उपयोग के [type='radio']बजाय jQuery 1.8 :radioदेशी डोम querySelectorAll()विधि द्वारा प्रदान प्रदर्शन को बढ़ावा देने का लाभ ले सकते हैं ।

— एडम

@PaoloBergantino उत्तर 100% सही है क्योंकि यह वांछित रेडियो बटन पर क्लिक करने के बाद मान लौटाता है। @ क्लेटन रबेंडा उत्तर यह नहीं देता है।

— आजम अल्वी

Answer 2

यह निर्धारित करने के लिए कि कौन सा रेडियो बटन चेक किया गया है, यह आज़माएँ:

$('input:radio[name=theme]').click(function() {
  var val = $('input:radio[name=theme]:checked').val();
});

घटना को समूह के सभी रेडियो बटन के लिए पकड़ा जाएगा और चयनित बटन का मूल्य वैल में रखा जाएगा।

अद्यतन: मैंने पोस्ट करने के बाद फैसला किया कि पाओलो का उत्तर बेहतर है, क्योंकि यह एक कम डोम ट्रैवर्सल का उपयोग करता है। मैं इस जवाब को देने दे रहा हूं क्योंकि यह दिखाता है कि चयनित तत्व को क्रॉस-ब्राउज़र संगत तरीके से कैसे प्राप्त किया जाए।

Comments

बेस डॉन मैं सवाल कैसे पढ़ता हूं, यह वह उत्तर था जिसकी मुझे जरूरत थी। : चेक किया कि मैं अपने समीकरण में क्या गायब था। धन्यवाद।

— HPWD

जिस तरह से jQuery के उपयोग के [type='radio']बजाय jQuery 1.8 :radioदेशी डोम querySelectorAll()विधि द्वारा प्रदान प्रदर्शन को बढ़ावा देने का लाभ ले सकते हैं ।

— एडम

मैंने बृहदान्त्र के बाद और गलती से "जाँच" करने से पहले एक स्थान दिया। इसलिए कृपया सुनिश्चित करें कि कोई जगह नहीं है।

— धूम्रपान बंदर

उन लोगों के लिए एक उपयोगी उत्तर जो एक क्लिक ईवेंट हैंडलर से मूल्य प्राप्त नहीं करना चाहते हैं। अन्यथा, आपको यह :checkedखोजने के लिए उपयोग करना होगा कि कौन सा बटन चेक किया गया है, उदाहरण के लिए, फॉर्म सबमिट इवेंट हैंडलर के साथ जहां thisकीवर्ड क्लिक बटन पर मैप नहीं करता है।

— चेज-अज़ेह

Answer 3

$('input:radio[name=theme]:checked').val();

Comments

मैं बस के साथ चला गया $("input[name=theme]:checked").val();( :radioभाग को छोड़कर और यह IE, FF, सफारी और क्रोम में ठीक काम करने लगता है। मुझे jQ v 1.3 के साथ काम करना था ... बेशक, इसका मतलब है कि केवल एक तत्व है जिसका नाम 'थीम' है।

— morespace54

यह सबसे अच्छा जवाब है IMO, यह कहता है "मुझे इस नाम के साथ चेक्ड रेडियो का मूल्य प्राप्त करें"। घटनाओं की कोई आवश्यकता नहीं, आदि

— ProVega

Answer 4

दूसरा रास्ता

$('input:radio[name=theme]').filter(":checked").val()

Comments

यह एक उपयोगी है, यदि आप

— स्वप्नेश

यह ठोस है क्योंकि आप $themeRadios = $('input:radio[name=theme'])किसी भी घटना संचालकों को सेट करने के लिए रेडियो बटन रखने के लिए एक चर का उपयोग कर सकते हैं, और फिर फ़िल्टर का उपयोग करके मान प्राप्त करें, जैसे $themeRadios.filter(":checked").val()।

— जोशुआ पिंटर

मुझे यह समाधान पसंद है।

— हाबिल

Answer 5

यह मेरे लिए बहुत अच्छा काम करता है। उदाहरण के लिए आपके पास एक ही "नाम" के साथ दो रेडियो बटन हैं, और आप बस चेक किए गए का मूल्य प्राप्त करना चाहते थे। आप यह कोशिश कर सकते हैं।

$valueOfTheCheckedRadio = $('[name=radioName]:checked').val();

Comments

यह उत्तर वर्तमान में स्वीकृत 230+ उत्क्रमित उत्तर से बेहतर है क्योंकि यह उत्तर उस समय के लिए भी है जब उपयोगकर्ता कीबोर्ड द्वारा रेडियो बटन के साथ इंटरैक्ट करता है।

— gmeben

Answer 6

निम्न कोड का उपयोग नाम से चयनित रेडियो बटन मूल्य प्राप्त करने के लिए किया जाता है

jQuery("input:radio[name=theme]:checked").val();

धन्यवाद अदनान

Comments

हम्म .. क्या मैंने आपके अंतिम उत्तर में आपके कोड स्वरूपण को ठीक नहीं किया है? कृपया इसका स्वयं ध्यान रखें :-)

— kleopatra

Answer 7

मुझे यह प्रश्न मिला, क्योंकि मैंने 1.7.2 से jQuery के 1.8.2 में अपग्रेड करने के बाद एक त्रुटि पर शोध किया था। मैं अपना उत्तर जोड़ रहा हूं क्योंकि jQuery 1.8 और उच्चतर में परिवर्तन हुआ है जो इस प्रश्न का उत्तर देने के तरीके में बदलाव करता है।

JQuery 1.8 के साथ उन्होंने छद्म चयनकर्ताओं जैसे: रेडियो,: चेकबॉक्स,: पाठ को चित्रित किया है।

ऊपर करने के लिए अब बस के :radioसाथ बदलें [type=radio]।

तो अब आपका उत्तर jQuery 1.8 और इसके बाद के संस्करण के सभी संस्करणों के लिए बन गया है:

$("input[type=radio][name=theme]").click(function() { 
    var value = $(this).val(); 
}); 

आप इस बदलाव के लिए 1.8 रीडमी और टिकट विशिष्ट पर बदलाव के बारे में पढ़ सकते हैं और साथ ही साथ यह भी समझ सकते हैं : अतिरिक्त सूचना अनुभाग के तहत रेडियो चयनकर्ता पृष्ठ पर क्यों ।

Comments

: चेक नहीं किया गया है। तो अगर आप उपयोग कर सकते हैं$("input[type='radio'][name='theme']:checked")

— एडम

Answer 8

जो वास्तव में सरल कुछ करने के लिए एक पुस्तकालय शामिल नहीं करना चाहता है के लिए:

document.querySelector('[name="theme"]:checked').value;

jsfiddle

वर्तमान उत्तरों के प्रदर्शन अवलोकन के लिए यहां देखें

Comments

इस उत्तर के लिए धन्यवाद। क्योंकि मैं किसी भी रूप में काम करने के लिए स्वीकृत जवाब पाने में असमर्थ था।

— क्रिस होम्स

Answer 9

यदि आप एक क्लिक ईवेंट से पहले डिफ़ॉल्ट चयनित रेडियो बटन का मूल्य जानना चाहते हैं, तो यह प्रयास करें:

चेतावनी ($ ( "इनपुट: रेडियो: चेक किया गया"।) वैल ());

Answer 10

यदि आपके पास पृष्ठ पर एक से अधिक रेडियो समूह हैं, तो आप फ़िल्टर फ़ंक्शन का उपयोग कर सकते हैं

$('input[type=radio]').change(function(){
    var value = $(this).filter(':checked' ).val();
    alert(value);
});

यहाँ फिडल url है

http://jsfiddle.net/h6ye7/67/

Answer 11

<input type="radio" name="ans3" value="help"> 
<input type="radio" name="ans3" value="help1">
<input type="radio" name="ans3" value="help2">

<input type="radio" name="ans2" value="test"> 
<input type="radio" name="ans2" value="test1">
<input type="radio" name="ans2" value="test2">

<script type="text/javascript">
  var ans3 = jq("input[name='ans3']:checked").val()
  var ans2 = jq("input[name='ans2']:checked").val()
</script>

Answer 12

यदि आप एक सही / गलत मान चाहते हैं, तो इसका उपयोग करें:

  $("input:radio[name=theme]").is(":checked")

Answer 13

कुछ इस तरह शायद?

$("input:radio[name=theme]").click(function() { 
 ...
}); 

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

Comments

@ JQuery के 1.3 के रूप में अमान्य है (इससे पहले भी पदावनत, यहां तक ​​कि)। blog.jquery.com/2009/01/05/help-test-jquery-13-beta-2 "पुरानी, ​​XPath, शैली विशेषता चयनकर्ता: [@ attr = value]। ये कुछ समय के लिए पदावनत कर दिए गए हैं - और हम। अंत में उन्हें हटा रहा है। इसे ठीक करने के लिए @ हटाएं!

— 22

Answer 14

मेरे पास एक ही पृष्ठ पर एक से अधिक रेडियो बटन हैं, आप रेडियो बटन का मान प्राप्त करने के लिए भी यह कोशिश कर सकते हैं:

$("input:radio[type=radio]").click(function() {
    var value = $(this).val();
    alert(value);
});

चीयर्स!

Answer 15

रेडियो बटन की सीमा को परिभाषित करने के लिए CSS क्लास का उपयोग कर सकते हैं और फिर मूल्य निर्धारित करने के लिए निम्नलिखित का उपयोग कर सकते हैं

$('.radio_check:checked').val()

Answer 16

यह मेरे लिए काम किया ..

HTML:

<input type="radio" class="radioClass" name="radioName" value="1" />Test<br/>
<input type="radio" class="radioClass" name="radioName" value="2" />Practice<br/>
<input type="radio" class="radioClass" name="radioName" value="3" />Both<br/>

jQuery:

    $ ("। रेडियोक्लास")। प्रत्येक (फ़ंक्शन () {
        अगर ($ (this) .is ( ': जाँच की'))
        चेतावनी ($ (this) .val ());
    });

आशा है ये मदद करेगा..

Answer 17

$('input:radio[name=theme]').bind(
  'click',
  function(){
    $(this).val();
});

Answer 18

आप वर्ग चयनकर्ता का उपयोग करके देख सकते हैं कि मूल्य ASP.NET RadioButtonनियंत्रण हमेशा खाली है और यहाँ कारण है।

आप नीचे दिए अनुसार RadioButtonनियंत्रण बनाते ASP.NETहैं:

<asp:RadioButton runat="server" ID="rbSingle" GroupName="Type" CssClass="radios" Text="Single" />
<asp:RadioButton runat="server" ID="rbDouble" GroupName="Type" CssClass="radios" Text="Double" />
<asp:RadioButton runat="server" ID="rbTriple" GroupName="Type" CssClass="radios" Text="Triple" />

और ASP.NETआपके लिए HTML का अनुसरण करता हैRadioButton

<span class="radios"><input id="Content_rbSingle" type="radio" name="ctl00$Content$Type" value="rbSingle" /><label for="Content_rbSingle">Single</label></span>
<span class="radios"><input id="Content_rbDouble" type="radio" name="ctl00$Content$Type" value="rbDouble" /><label for="Content_rbDouble">Double</label></span>
<span class="radios"><input id="Content_rbTriple" type="radio" name="ctl00$Content$Type" value="rbTriple" /><label for="Content_rbTriple">Triple</label></span>

क्योंकि ASP.NETहम RadioButtonनियंत्रण नाम या आईडी का उपयोग नहीं करना चाहते हैं क्योंकि वे किसी भी कारण से उपयोगकर्ता के हाथ से बदल सकते हैं (कंटेनर नाम, प्रपत्र नाम, उपयोगकर्ता का नाम, उपयोगकर्ता नाम ...) जैसा कि आप ऊपर दिए गए कोड में देख सकते हैं।

RadioButtonJQuery का उपयोग करने का मूल्य प्राप्त करने के लिए केवल शेष संभव तरीका सीएसएस वर्ग का उपयोग कर रहा है जैसा कि इस उत्तर में पूरी तरह से असंबंधित प्रश्न के रूप में वर्णित है

$('span.radios input:radio').click(function() {
    var value = $(this).val();
});