दिलचस्प पोस्ट
iPhone UIWebView स्थानीय संसाधनों का उपयोग कर जावास्क्रिप्ट और हैंडलिंग अनुदेषण बदलें bash: $ बनाम। $ ((<अंकगणितीय-अभिव्यक्ति>)) एक MySQL डाटाबेस में एक्सेल फ़ाइल कैसे आयात करें MySQL datetime फ़ील्ड और डेलाइट बचत समय – मैं "अतिरिक्त" घंटे का संदर्भ कैसे दूं? WPF में XAML में DataContext सेट करना अद्वितीय_पटल बढ़ावा देने के समकक्ष? छिपा फ़ोल्डर्स के बिना ओएस वॉक एक नई रेल परियोजना में SQLite से PostgreSQL में बदलें मूल कोड, मशीन कोड और विधानसभा कोड के बीच अंतर क्या है? क्या किसी भी जेवीएम के जेआईटी कम्पाइलर कोड उत्पन्न करते हैं जो वैक्टरित फ्लोटिंग प्वाइंट निर्देशों का उपयोग करता है? अनुक्रमिक प्राथमिक कुंजी के साथ प्रश्न डालें डायरेक्टिव से नियंत्रक तक एक AngularJS स्कोप चर को पारित करने का सबसे आसान तरीका? मैं किसी रिमोट के लिए विशिष्ट प्रतिबद्ध कैसे कर सकता हूँ, और पिछला नहीं करता? 2 पोस्ट कोड (यूके) के बीच की दूरी को पूरा करने के लिए PHP और Google मैप्स एपीआई का उपयोग करना जावा ईई वेब अनुप्रयोग में वेब-आईएनएफ क्या इस्तेमाल किया जाता है?

<Select> jquery के साथ विकल्प बदलने के लिए कैसे?

समझे कि विकल्पों की एक सूची उपलब्ध है, आप <select> साथ नए <option> s को कैसे अपडेट करते हैं?

Solutions Collecting From Web of "<Select> jquery के साथ विकल्प बदलने के लिए कैसे?"

empty विधि का उपयोग करके आप मौजूदा विकल्पों को निकाल सकते हैं, और उसके बाद अपने नए विकल्प जोड़ सकते हैं:

 var option = $('<option></option>').attr("value", "option value").text("Text"); $("#selectId").empty().append(option); 

यदि आपके पास किसी ऑब्जेक्ट में आपके नए विकल्प हैं, तो आप निम्न कर सकते हैं:

 var newOptions = {"Option 1": "value1", "Option 2": "value2", "Option 3": "value3" }; var $el = $("#selectId"); $el.empty(); // remove old options $.each(newOptions, function(key,value) { $el.append($("<option></option>") .attr("value", value).text(key)); }); 

संपादित करें: सभी विकल्पों को हटाने के लिए लेकिन सबसे पहले, आप :gt चयनकर्ता का उपयोग कर सकते हैं, जो शून्य से अधिक से अधिक इंडेक्स के साथ सभी option तत्व प्राप्त कर सकते हैं और उन्हें remove हैं:

 $('#selectId option:gt(0)').remove(); // remove all options, but not the first 

मैं एक त्वरित jQuery एक्सटेंशन में सीएमएस के उत्कृष्ट उत्तर फेंक दिया:

 (function($, window) { $.fn.replaceOptions = function(options) { var self, $option; this.empty(); self = this; $.each(options, function(index, option) { $option = $("<option></option>") .attr("value", option.value) .text(option.text); self.append($option); }); }; })(jQuery, window); 

इसमें "पाठ" और "मूल्य" कुंजियां शामिल वस्तुओं की एक सरणी की उम्मीद है तो उपयोग निम्नानुसार है:

 var options = [ {text: "one", value: 1}, {text: "two", value: 2} ]; $("#foo").replaceOptions(options); 
 $('#comboBx').append($("<option></option>").attr("value",key).text(value)); 

जहां comboBx आपका कॉम्बो बॉक्स आईडी है

या आप पहले से मौजूद इन्ह्रीन के लिए स्ट्रिंग के रूप में विकल्प जोड़ सकते हैं और फिर इन्हें चुनें innerHTML को आवंटित कर सकते हैं।

संपादित करें

यदि आपको पहला विकल्प रखने और अन्य सभी को हटाने की आवश्यकता है तो आप इसका उपयोग कर सकते हैं

 var firstOption = $("#cmb1 option:first-child"); $("#cmb1").empty().append(firstOption); 

कुछ अजीब कारणों से इस भाग के लिए

 $el.empty(); // remove old options 

सीएमएस समाधान से मेरे लिए काम नहीं किया गया था, इसलिए इसके बजाय मैंने इसका इस्तेमाल किया है

 el.html(' '); 

और यह काम करता है तो मेरा काम कोड अब ऐसा दिखता है:

 var newOptions = { "Option 1":"option-1", "Option 2":"option-2" }; var $el = $('.selectClass'); $el.html(' '); $.each(newOptions, function(key, value) { $el.append($("<option></option>") .attr("value", value).text(key)); }); 

मौजूदा एक के संशोधन की तुलना में DOM तत्व को हटाने और जोड़ना धीमा है

यदि आपके विकल्प सेट की लंबाई समान है, तो आप ऐसा कुछ कर सकते हैं:

 $('#my-select option') .each(function(index) { $(this).text('someNewText').val('someNewValue'); }); 

यदि आपके नए विकल्प सेट में अलग-अलग लंबाई है, तो आप ऊपर वर्णित तकनीक का उपयोग करके वास्तव में आवश्यक खाली विकल्प जोड़ सकते हैं / हटा सकते हैं।

उदाहरण के लिए यदि आपके एचटीएमएल कोड में यह कोड होता है:

 <select id="selectId"><option>Test1</option><option>Test2</option></select> 

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

 var option = $('<option></option>').attr("value", "option value").text("Text"); $("#selectId").html(option); 

उपरोक्त इस उदाहरण में मैं विकल्प की पुरानी सूची को केवल एक नए विकल्प से बदलूंगा।

यदि हम <select> लगातार अपडेट करते हैं और हमें पिछले मान को सहेजना होगा:

 var newOptions = { 'Option 1':'value-1', 'Option 2':'value-2' }; var $el = $('#select'); var prevValue = $el.val(); $el.empty(); $.each(newOptions, function(key, value) { $el.append($('<option></option>').attr('value', value).text(key)); if (value === prevValue){ $el.val(value); } }); $el.trigger('change'); 

क्या यह मदद करता है?

 $("#SelectName option[value='theValueOfOption']")[0].selected = true;