चयनित तत्व से चयनित विकल्प प्राप्त करें


93

मैं एक ड्रॉपडाउन से चयनित विकल्प प्राप्त करने और उस पाठ के साथ किसी अन्य आइटम को पॉप्युलेट करने की कोशिश कर रहा हूं, जो निम्नानुसार है। IE एक तूफान की छाल कर रहा है और यह फ़ायरफ़ॉक्स में काम नहीं करता है:

$('#ddlCodes').change(function() {
  $('#txtEntry2').text('#ddlCodes option:selected').text();
});

मैं क्या गलत कर रहा हूं?

जवाबों:


187

यहाँ एक छोटा संस्करण है:

$('#ddlCodes').change(function() {
  $('#txtEntry2').text($(this).find(":selected").text());
});

karim79 ने एक अच्छी पकड़ बनाई, आपके तत्व नाम से देखते हुए txtEntry2एक टेक्स्टबॉक्स हो सकता है, अगर यह किसी भी तरह का इनपुट है, तो आपको .val()इसके बजाय या .text()इस तरह का उपयोग करना होगा:

  $('#txtEntry2').val($(this).find(":selected").text());

"क्या गलत है?" प्रश्न का हिस्सा: .text()एक चयनकर्ता नहीं लेता है, यह आपके द्वारा सेट किए गए पाठ को लेता है, या पहले से ही पाठ को वापस करने के लिए कुछ भी नहीं है। इसलिए आपको अपने इच्छित पाठ को लाने की आवश्यकता है, फिर इसे .text(string)उस ऑब्जेक्ट पर विधि में रखें जिसे आप सेट करना चाहते हैं, जैसे कि मैंने ऊपर दिया है।


7
यदि txtEntry2एक पाठ इनपुट है, तो ओपी को val()इसके बजाय उपयोग करने की आवश्यकता होगी ।
करीम k

@ karim79 - अच्छा बिंदु, तत्व नाम से यह शायद है, अद्यतन करना।
निक Craver

हाँ, .text को बदलकर .val और टेक्स्ट को अलग-अलग तरीके से लाने से, सब कुछ बाहर निकल गया। धन्यवाद फाल्स
मैट

आपने मुझे आधिकारिक तौर पर पागल होने से बचा लिया!
नथनचेरे

15

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

$('#ddlCodes').change(function() {
  var option = this.options[this.selectedIndex];
  $('#txtEntry2').text($(option).text());
});

8

यहाँ एक छोटा संस्करण है जिसे काम करना चाहिए:

 $('#ddlCodes').change(function() {
      $('#txtEntry2').text(this.val());
    });

बिना टाइप किए टाइप: ऑब्जेक्ट # <HTMLSelectElement> का कोई तरीका 'वैल' नहीं है
DoodleKana

1
this.valueइसे ठीक कर देंगे।
क्रि सेल्बेक

4

कम jQuery के साथ:

<select name="ddlCodes"
 onchange="$('#txtEntry2').text(this.options[this.selectedIndex].value);">

this.options[this.selectedIndex].value सादा जावास्क्रिप्ट है।

(स्रोत: जर्मन SelfHTML )


2

निम्नलिखित कोड का प्रयास करें

$('#ddlCodes').change(function() {
  $('#txtEntry2').val(  $('#ddlCodes :selected').text() );
});

2

चयनित तत्वों की संख्या जानने के लिए उपयोग करें

$("select option:selected").length

सभी चयनित तत्वों का उपयोग करने के लिए मूल्य प्राप्त करें

    var str = "";
  $("select option:selected").each(function () {
        str += $(this).text() + " ";
      });


1

पहला भाग ड्रॉप डाउन मेनू से तत्व प्राप्त करना है जो इस तरह दिख सकता है:

<select id="cycles_list">
    <option value="10">10</option>
    <option value="100">100</option>
    <option value="1000">1000</option>
    <option value="10000">10000</option>
</select>

JQuery के माध्यम से पकड़ने के लिए आप ऐसा कुछ कर सकते हैं:

$('#cycles_list').change(function() {
    var mylist = document.getElementById("cycles_list");
    iterations = mylist.options[mylist.selectedIndex].text;
});

एक बार जब आप अपने चर में मूल्य संग्रहीत कर लेते हैं, तो अगला चरण चर में संग्रहीत जानकारी को आपके चयन के फॉर्म फ़ील्ड या HTML तत्व में भेजना होगा। यह एक div p या कस्टम तत्व हो सकता है।

अर्थात <p></p> OR <div></div>

आप उपयोग करेंगे:

$ ( 'पी') एचटीएमएल (पुनरावृत्तियों)। या $ ('div')। Html (पुनरावृत्तियों);

यदि आप एक पाठ क्षेत्र को आबाद करना चाहते हैं जैसे:

<input type="text" name="textform" id="textform"></input>

आप उपयोग करेंगे:

$ ('# टेक्स्टफॉर्म')। टेक्स्ट = पुनरावृत्तियों;

बेशक आप उपरोक्त सभी चरणों को कम चरणों में कर सकते हैं, मेरा मानना ​​है कि यह लोगों को सीखने में मदद करता है जब आप चरणों को समझने के लिए इसे आसानी से तोड़ते हैं ... आशा है कि यह मदद करता है!


1

चयनित संपत्ति (HTML5) का उपयोग करके आप चयनित विकल्प प्राप्त कर सकते हैं

document.getElementbyId("id").selectedOptions; 

JQuery के साथ ऐसा करके हासिल किया जा सकता है

$("#id")[0].selectedOptions; 

या

$("#id").prop("selectedOptions");

इस एक चयनित विकल्प में संपत्ति में HTMLCollection array similitar है

[<option value=​"1">​ABC</option>]

या कई चयन

[<option value=​"1">​ABC</option>, <option value=​"2">​DEF</option> ...]

0

उपरोक्त बहुत अच्छी तरह से काम करेगा, लेकिन ऐसा लगता है कि आपने ड्रॉपडाउन पाठ के लिए jQuery के टाइपकास्ट को याद किया है। इसके अलावा .val()इनपुट टेक्स्ट टाइप तत्व के लिए टेक्स्ट सेट करने के लिए उपयोग करना उचित होगा । इन परिवर्तनों के साथ कोड निम्नलिखित की तरह दिखेगा:

    $('#txtEntry2').val($('#ddlCodes option:selected').text());

0

यदि आपके पास यह पहले से है और jquery का उपयोग करें तो यह आपका उत्तर होगा:

$ ($ (इस) [0] .selectedOptions [0])। पाठ ()


0

इस HTML को देखते हुए:

<select>
    <option value="0">One</option>
    <option value="1">Two</option>
</select>

JQuery v1.6 + के लिए विवरण द्वारा चुनें:

var text1 = 'Two';
$("select option").filter(function() {
    //may want to use $.trim in here
    return $(this).text() == text1; 
}).prop('selected', true);
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.