यदि कोई विकल्प चुना जाता है, तो कैसे जांचें?


146
$('#mySelectBox option').each(function() {
    if ($(this).isChecked())
       alert('this option is selected');
     else
       alert('this is not');
});

जाहिर है, isCheckedकाम नहीं करता है। तो मेरा सवाल यह है कि ऐसा करने का उचित तरीका क्या है? धन्यवाद।


2
00z9600, नीचे दिए गए कई विकल्पों में से उत्तर खोजने के लिए धन्यवाद। हालांकि, कृपया चयनित संपत्ति तक पहुँचने के लिए 'सर्वोत्तम' तरीके के बारे में नीचे टिप्पणी में बातचीत का नोटिस करना सुनिश्चित करें। सामान्य बात यह है कि जब आप सीधे जावास्क्रिप्ट (उपयोग this.selected) में एक तत्व को एक्सेस कर सकते हैं जिसे आपको jQuery ( $(this).prop("selected")) का उपयोग करके बायपास करना चाहिए, लेकिन वे दोनों आपके लिए काम करेंगे
वेट्रेन

जवाबों:


263

अपडेट करें

चयनित विकल्प के लिए एक अधिक प्रत्यक्ष jQuery विधि होगी:

var selected_option = $('#mySelectBox option:selected');

इस प्रश्न .is(':selected')का उत्तर देना कि आप क्या देख रहे हैं:

$('#mySelectBox option').each(function() {
    if($(this).is(':selected')) ...

गैर jQuery (यकीनन सबसे अच्छा अभ्यास) तरीका यह होगा:

$('#mySelectBox option').each(function() {
    if(this.selected) ...

हालाँकि, यदि आप केवल चयनित मूल्य के लिए प्रयास कर रहे हैं:

$('#mySelectBox').val()

यदि आप चयनित मूल्य के पाठ को खोज रहे हैं:

$('#mySelectBox option').filter(':selected').text();

बाहर की जाँच करें: http://api.jquery.com/selected-selector/

अगली बार डुप्लिकेट SO प्रश्नों की तलाश करें:

वर्तमान चयनित विकल्प प्राप्त करें या चयनित विकल्प सेट करें या jQuery में $ (यह) चयनित विकल्प कैसे प्राप्त करें? या विकल्प [चयनित = सत्य] काम नहीं करता है


यह बिना किसी अच्छे कारण के jQuery का उपयोग करता है। देशी js DOM प्रॉपर्टी का उपयोग करें। इस
gdoron

3
ऐसा लगता है कि आपने मेरा उत्तर नहीं पढ़ा है। this.selectedके बजाय इस्तेमाल किया जा सकता है $(this).is(":selected")मुझे लगता है कि इसके लिए jsperf की कोई आवश्यकता नहीं है, है ना? मेरे पास jQuery का उपयोग करने के खिलाफ कुछ भी नहीं है!, लेकिन इसका उपयोग तब करें जब आपको इसकी आवश्यकता हो, तब न कि जब यह ओवरहेड और अधिक कोड के अलावा कुछ नहीं दे।
गेदरॉन

@gdoron this.selectedपूरी तरह से वैध है लेकिन उन्होंने इसे करने के लिए उचित jQuery तरीका पूछा है।
इब्रानियों लालच

2
@gdoron मैं आपसे पूरी तरह सहमत हूँ। हो सकता है कि हम में से जो लोग jQuery पर लाए हैं उन्हें एक रीमेडिकल जावास्क्रिप्ट क्लास लेने की जरूरत है। :)
आयम्ब्रिंसड

2
@gmoron नहीं, मेरा सवाल वोट डाउन था और मतदान हुआ। हालांकि अच्छा जासूसी का काम।
Iambriansreed

26

आप इस तरह से चयनित विकल्प प्राप्त कर सकते हैं:

$('#mySelectBox option:selected')...

लाइव डेमो

लेकिन अगर आप सभी विकल्पों को पुनरावृत्त करना चाहते हैं, तो इसके this.selectedबजाय ऐसा करें this.isCheckedजिसमें मौजूद नहीं है:

$('#mySelectBox option').each(function() {
    if (this.selected)
       alert('this option is selected');
     else
       alert('this is not');
});

लाइव डेमो

अपडेट करें:

आपको इसका उपयोग करने का सुझाव देने वाले बहुत सारे उत्तर मिले:

$(this).is(':selected')ठीक है, यह एक बहुत तेजी से और आसानी से किया जा सकता है this.selectedतो आपको इसका उपयोग क्यों करना चाहिए और देशी डोम तत्व विधि नहीं चाहिए ?!

पढ़ें आपका डोम गुण और कार्य में पता में jQuery टैग की जानकारी


1
@downvoter, टिप्पणी करने के लिए परवाह है? रंगों से बाहर निकलो और लड़ो! :)
gdoron

हो सकता है क्योंकि आपने सवाल का जवाब नहीं दिया, लेकिन सबसे अच्छा अभ्यास दिया। ;)
आयंब्रिंसड

1
@iambriansreed। हा ?! मैंने सवाल का जवाब नहीं दिया? प्रश्न में क्या हिस्सा अनुत्तरित रहा?
gdoron

2
दिलचस्प चर्चा यहाँ। :) यकीन नहीं क्यों सभी DVs, लेकिन मैं सबको इस्तेमाल करना चाहते थे UV'd this.selected। मैं jQuery के अति प्रयोग / दुरुपयोग के बारे में आपकी टिप्पणियों से सहमत हूं। जानने का हिस्सा jQuery, यह जानने के लिए है कि इसका उपयोग कब नहीं करना है। उस ने कहा, ध्यान रखें कि ':selected'चयनकर्ता एक कस्टम सिज़ल चयनकर्ता है, इसलिए इसका उपयोग querySelectorAllसमर्थित ब्राउज़र में उपयोग को अक्षम करता है। यह निश्चित रूप से दुनिया का अंत नहीं है, क्योंकि यह कुछ अच्छा, संक्षिप्त कोड प्रदान करता है, लेकिन मैं व्यक्तिगत रूप से सिज़ल-केवल सामान से बचने के लिए हूं।

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

4

यदि आप परिचित या सहज नहीं हैं is(), तो आप बस के मूल्य की जांच कर सकते हैं prop("selected")

जैसा कि यहां देखा गया है :

$('#mySelectBox option').each(function() {
    if ($(this).prop("selected") == true) {
       // do something
    } else {
       // do something
    }
});​

संपादित करें :

जैसा कि @gdoron ने टिप्पणियों में बताया है, किसी विकल्प की चयनित संपत्ति तक पहुंचने का सबसे तेज़ और सबसे उपयुक्त तरीका DOM चयनकर्ता है। यहाँ इस क्रिया को प्रदर्शित करने वाला फिडेल अपडेट है।

if (this.selected == true) {

के रूप में अच्छी तरह से काम करने के लिए प्रकट होता है! धन्यवाद gdoron


तुम मुझे कृपया उसका वर्णन क्यों वह का उपयोग करना चाहिए $(this).prop("selected")बजाय this.selected?! यह आपको क्या देता है ?? ps मैं
नीच

@gdoron, मुख्य लाभ जो मैंने सोचा था कि परिचित था। मुझे यकीन नहीं है कि किस चीज के isलिए सबसे अच्छा उपयोग किया जाता है, लेकिन मुझे प्रोप और एटर द्वारा अपनी संपत्तियों तक पहुंच पसंद है। ज्यादातर परिदृश्यों में यह सिर्फ स्वाद की बात हो सकती है। हां, नीचे मतदान के लिए उत्सुकता है!
वेट्रेन

2
मुझे पता है कि आपकी DOM प्रॉपर्टीज और फंक्शन्स का हिस्सा jQuery टैग जानकारी को पढ़ने का सुझाव है । सरल कार्य करने के लिए धीमे कोड + अधिक कोड का उपयोग करने का कोई कारण नहीं है। $ (...) .is()जैसे जटिल चयनकर्ता के लिए उपयोग किया जाना चाहिए $(...).is('.foo > [name="aaa"] input') or for properties that are not native DOM elements properties like । (": दृश्यमान")।
gdoron

@gdoron; यह इंगित करने के लिए बहुत बहुत धन्यवाद। मैंने उसी हिसाब से अपना जवाब अपडेट किया है।
वेट्रेन

कोई परेशानी नहीं। आप मेरे उत्तर को बढ़ा सकते हैं यदि आपको लगता है कि यह बेहतर है तो अन्य। (मैं नहीं चाहता कि इसका उत्तर $(this).is(':selected')स्वीकार किया जाए।
स्टैकओवरफ़्लो का

3

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

$(document).ready(function(){
 $('#panel_master_user_job').change(function () {
 var job =  $('#panel_master_user_job').val();
 alert(job);
})
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="job" id="panel_master_user_job" class="form-control">
                                    <option value="master">Master</option>
                                    <option value="user">User</option>
                                    <option value="admin">Admin</option>
                                    <option value="custom">Custom</option>
                                </select>


2

उपयोग

 $("#mySelectBox option:selected");

परीक्षण करने के लिए अगर इसका एक विशेष विकल्प myoption:

 if($("#mySelectBox option:selected").text() == myoption){
          //...
 }

आप (यहाँ एक धारावाहिक चढ़ाव है!) नीचे नहीं किया था लेकिन क्या है myoption???
गेदरॉन

1
सिर्फ एक स्ट्रिंग जिसे एक उदाहरण विकल्प माना जाता है जिसे ओपी अपने चयनित का परीक्षण करना चाहता है
मौना चीखना

पतन के संबंध में, आप मेरे उत्तर के तहत टिप्पणियों को पढ़ना चाह सकते हैं ।
gdoron

2

इसे अपनी चयनित सूची के रूप में देखें:

<select onchange="var optionVal = $(this).find(':selected').val(); doSomething(optionVal)">

                                <option value="mostSeen">Most Seen</option>
                                <option value="newst">Newest</option>
                                <option value="mostSell">Most Sell</option>
                                <option value="mostCheap">Most Cheap</option>
                                <option value="mostExpensive">Most Expensive</option>

                            </select>

तो आप इस तरह चयनित विकल्प की जाँच करें:

function doSomething(param) {

    if ($(param.selected)) {
        alert(param + ' is selected!');
    }

}

0

मेरे मामले में मुझे नहीं पता कि चयनित हमेशा सच क्यों होता है। तो एक ही रास्ता मुझे लगता है कि था:

var optionSelected = false;
$( '#select_element option' ).each( function( i, el ) {
    var optionHTMLStr = el.outerHTML;

    if ( optionHTMLStr.indexOf( 'selected' ) > 0 ) {
        optionSelected = true;
        return false;
    }
});

0

यदि आप केवल यह देखना चाहते हैं कि क्या विकल्प चुना गया है, तो आपको सभी विकल्पों के माध्यम से पुनरावृति करने की आवश्यकता नहीं है। बस करो

if($('#mySelectBox').val()){
    // do something
} else {
    // do something else
}

नोट: यदि आपके पास मूल्य = 0 का विकल्प है जिसे आप चयन करना चाहते हैं, तो आपको if-condition को बदलना होगा $('#mySelectBox').val() != null


0

यदि आपको विशिष्ट मूल्य के लिए चयनित राज्य की जाँच करने की आवश्यकता है :

$('#selectorId option[value=YOUR_VALUE]:selected')

0

यदि आप जावास्क्रिप्ट के माध्यम से चयनित विकल्प की जांच करना चाहते हैं

उस टैग में सरलतम विधि onchange विशेषता है और js फ़ाइल में एक फ़ंक्शन को परिभाषित करें उदाहरण देखें यदि आपकी HTML फ़ाइल में कुछ इस तरह से विकल्प हैं

 <select onchange="subjects(this.value)">
               <option>Select subject</option>
               <option value="Computer science">Computer science</option>
               <option value="Information Technolgy">Information Technolgy</option>
               <option value="Electronic Engineering">Electronic Engineering</option>
               <option value="Electrical Engineering">Electrical Engineering</option>
 </select>

और अब js file में function add करें

function subjects(str){
    console.log(`selected option is ${str}`);
}

अगर आप php फाइल में सेलेक्टेड ऑप्शन को चेक करना चाहते हैं

बस अपने टैग में नाम विशेषता दें और इसे php फ़ाइल तक पहुँचें वैश्विक चर / सरणी ($ _GET या $ _POST) उदाहरण देखें यदि आपकी html फ़ाइल कुछ इस तरह है

<form action="validation.php" method="POST">
             Subject:<br>
            <select name="subject">
               <option>Select subject</option>
               <option value="Computer science">Computer science</option>
               <option value="Information Technolgy">Information Technolgy</option>
               <option value="Electronic Engineering">Electronic Engineering</option>
               <option value="Electrical Engineering">Electrical Engineering</option>
            </select><br>

         </form>

और आपकी php फ़ाइल में वैद्यता है। यदि आप इस तरह से पहुँच सकते हैं

$subject = $_POST['subject'];
echo "selected option is $subject";
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.