jQuery को चयनित विकल्प मान मिलता है (पाठ नहीं, लेकिन विशेषता 'मूल्य')

Question

ठीक है, मेरे पास यह कोड है:

<select name="selector" id="selector">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
</select>

और मैं चयनित विकल्प का मूल्य प्राप्त करना चाहूंगा। उदाहरण: 'विकल्प 2' चुना गया है, और इसका मूल्य '2' है। '2' वह मूल्य है जो मुझे प्राप्त करने की आवश्यकता है और 'विकल्प 2' नहीं।

Comments

प्राप्त करने के लिए डेमो ट्यूटोरियल: freakyjolly.com/... डेमो ट्यूटोरियल की स्थापना के लिए freakyjolly.com/... एकल और एकाधिक selectbox

— संहिता जासूस

Answer 1

04/2020: पुराना उत्तर सही

का उपयोग करें : चयनित विकल्पों पर चयनित psuedo चयनकर्ता और फिर विकल्प का मान प्राप्त करने के लिए .val फ़ंक्शन का उपयोग करें ।

$('select[name=selector] option').filter(':selected').val()

साइड नोट : फ़िल्टर का उपयोग करना बेहतर है फिर :selectedचयनकर्ता को सीधे पहली क्वेरी में उपयोग करना ।

यदि एक परिवर्तन हैंडलर के अंदर, आप this.valueचयनित विकल्प मान प्राप्त करने के लिए बस का उपयोग कर सकते हैं । अधिक विकल्पों के लिए डेमो देखें।

//ways to retrieve selected option and text outside handler
console.log('Selected option value ' + $('select option').filter(':selected').val()); 
console.log('Selected option value ' + $('select option').filter(':selected').text());

$('select').on('change', function () {
  //ways to retrieve selected option and text outside handler
  console.log('Changed option value ' + this.value);
  console.log('Changed option text ' + $(this).find('option').filter(':selected').text());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<select>
  <option value="1" selected>1 - Text</option>
  <option value="2">2 - Text</option>
  <option value="3">3 - Text</option>
  <option value="4">4 - Text</option>
</select>

पुराना उत्तर:

संपादित करें: जितने इंगित किए गए हैं, यह चयनित विकल्प मान नहीं लौटाता है।

~~ चयनित विकल्प का मान प्राप्त करने के लिए .val का उपयोग करें । निचे देखो,

$('select[name=selector]').val()~~

Comments

उर परीक्षण करें:$('select[name=selector]').change(function() { alert($(this).val()); });

— KingRider

ध्यान दें कि यदि चयनित विकल्प में कोई valueविशेषता निर्दिष्ट नहीं है, तो लेबल (यानी <option>label</option>) वापस आ जाएगा। हमेशा वह नहीं हो सकता जो आप चाहते हैं। बेशक, अधिकांश अनुप्रयोगों में, मूल्य निर्दिष्ट है।

— Czechnology

Answer 2

मैं सिर्फ अपना अनुभव बांटना चाहता था

मेरे लिए,

$('#selectorId').val()

वापस लौट आया।

मुझे इस्तेमाल करना था

$('#selectorId option:selected').val()

Comments

क्या वह ब्राउज़र विशिष्ट मामला था? क्या क्रोम के नवीनतम संस्करण ने इसकी अनुमति नहीं दी थी, या क्या यह IE था जो इसे समर्थन नहीं करता था?

— थियोडोर Solbjørg

यह क्रोम के नवीनतम संस्करण में था। शायद फ़ायरफ़ॉक्स में भी, लेकिन यकीन नहीं।

— डेविड टॉरेस

$('#selectorId option:selected').val()मुझे यकीन नहीं है कि मेरे लिए काम क्यों नहीं किया। इसके बजाय मैंने इस्तेमाल किया$('select option:selected').val()

— फ्रांसिस्को क्विंटो

@Francisco समस्या यह है कि $('select option:selected').val()HTML कोड में पहले चयनकर्ता का मान लेगा। जबकि आपके साथ $('#selectorId option:selected').val()चयनकर्ता का मूल्य हो सकता है जो आपने निर्दिष्ट किया है। टाइपोस के लिए डबल चेक। यहाँ एक उदाहरण है जो दिखाता है कि मैंने अभी क्या कहा: codepen.io/anon/pen/Nqgqyz

— डेविड टॉरेस

Answer 3

$('select').change(function() {
    console.log($(this).val())
});​

jsFiddle उदाहरण

.val() मान मिलेगा।

Answer 4

आपको अपने चयन में एक आईडी जोड़ने की आवश्यकता है। फिर:
$('#selectorID').val()

Comments

मैं आईडी जोड़ दिया है, बस इसे यहाँ जोड़ना भूल गया।

— 15:00

एक चयनकर्ता के रूप में एक आईडी का उपयोग करके मैंने जो पढ़ा है, वह सबसे तेज़ तरीका है।

— मार्कस

Answer 5

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

$(document).ready(function(){
    var data= $('select').find('option:selected').val();
});

या

var data= $('select').find('option:selected').text();

Answer 6

आप jqueryनिम्नानुसार उपयोग कर सकते हैं

स्क्रिप्ट

  $('#IDOfyourdropdown').change(function(){
    alert($(this).val());
  });

FIDDLE यहाँ है

Answer 7

इस तरह एक चयन के लिए

<select class="btn btn-info pull-right" id="list-name" style="width: auto;">
   <option id="0">CHOOSE AN OPTION</option>
   <option id="127">John Doe</option>
   <option id="129" selected>Jane Doe</option>

... आप इस तरह से आईडी प्राप्त कर सकते हैं:

$('#list-name option:selected').attr('id');

या आप इसके बजाय मूल्य का उपयोग कर सकते हैं, और इसे आसान तरीका प्राप्त कर सकते हैं ...

<select class="btn btn-info pull-right" id="list-name" style="width: auto;">
   <option value="0">CHOOSE AN OPTION</option>
   <option value="127">John Doe</option>
   <option value="129" selected>Jane Doe</option>

इस तरह:

$('#list-name').val();

Answer 8

मेरे विकल्पों में से एक का मूल्य नहीं था <option>-----</option>:। मैं उपयोग करने की कोशिश कर रहा था if (!$(this).val()) { .. }लेकिन मुझे अजीब परिणाम मिल रहे थे। यदि आपके पास valueअपने <option>तत्व पर कोई विशेषता नहीं है , तो यह खाली स्ट्रिंग के बजाय इसके अंदर पाठ लौटाता है। यदि आप val()अपने विकल्प के लिए कुछ भी वापस नहीं करना चाहते हैं , तो जोड़ना सुनिश्चित करें value=""।

Answer 9

उदाहरण देखो:

    <select class="element select small" id="account_name" name="account_name"> 

        <option value="" selected="selected">Please Select</option>           
        <option value="paypal" >Paypal</option>
        <option value="webmoney" >Webmoney</option>

    </select>

 <script type="text/javascript">

        $(document).ready(function(){ 
             $('#account_name').change(function(){
               alert($(this).val());                                                          
             });
        });
 </script>

Answer 10

$('#selectorID').val();

या

$('select[name=selector]').val();

या

$('.class_nam').val();

Comments

@FarhadBagherlo "रखें टाइपिंग" है नहीं एक उपयोगी टिप्पणी संपादित करें! कृपया अपने परिवर्तनों को संक्षेप में प्रस्तुत करें, ताकि संपादित इतिहास के पाठक समझ सकें कि आपने प्रत्येक परिवर्तित चरित्र का निरीक्षण किए बिना क्या किया है। धन्यवाद!

— jpaugh

Answer 11

यह कोड मेरे लिए बहुत अच्छा काम करता है: यह चयनित विकल्प का मान लौटाता है। $ ( '# Select_id') लगता है ( 'विकल्प: चयनित') वैल ();।।

Answer 12

 $(document ).ready(function() {
    $('select[name=selectorname]').change(function() { 
     alert($(this).val());});
 });

Comments

हालांकि यह कोड समस्या को हल कर सकता है, लेकिन विस्तार को जोड़ना और यह स्पष्ट करना सबसे अच्छा है कि यह उन लोगों के लिए कैसे काम करता है जो इस कोड के टुकड़े को नहीं समझ सकते हैं।

— पेपर 1111

@ paper1111 यह सरल कार्य है। मैं समझा सकता हूं कि क्या इसकी जरूरत है। $ ('select [name = here is select बॉक्स नाम]] .change () - इसका अर्थ यह है कि जब हम सेलेक्ट करेंगे बॉक्स ऑप्शन फ़ंक्शन काम करेगा। $ (यह) .val () - यह चयनित विकल्प मान

— लौटाता है

Answer 13

स्रोत लिंक

चयनित मान और पाठ प्राप्त करने के लिए jQuery वैल () का उपयोग करें और टेक्स्ट विकल्प प्राप्त करने के लिए () ।

    <select id="myDropDown" class="form-control">
        <option value="0">Select Value 0</option>
        <option value="8">Option value 8</option>
        <option value="5">Option value 5</option>
        <option value="4">Option value 4</option>
    </select>

ईवेंट को चुनिंदा ड्रॉपडाउन पर बदलें

        $("#myDropDown").change(function () {

            // Fetching Value
            console.log($(this).val());

            // Fetching Text
            console.log($(this).find('option:selected').text());

            alert('Value: '+$(this).val()+' | Text: '+$(this).find('option:selected').text());
        });

बटन पर क्लिक करें

        $("button").click(function () {

        // Fetching Value
            console.log($("#myDropDown").val());

    // Fetching Text
            console.log($('#myDropDown option:selected').text());

            alert('Value: '+$("#myDropDown").val()+' | Text: '+$('#myDropDown option:selected').text());
        });