選択した要素から選択したオプションを取得

次のように、ドロップダウンから選択したオプションを取得し、そのテキストを別の項目に入力しようとしています。IEは嵐を呼んでおり、Firefoxでは動作しません。

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

何が悪いのですか？

ここに短いバージョンがあります：

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

karim79は良いキャッチをしました。要素名txtEntry2がテキストボックスである可能性があると判断すると、それが何らかの入力である場合は、.val()代わりに、または次の.text()ように使用する必要があります。

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

「何が悪いの？」質問の一部：.text()セレクターを使用しない、設定したいテキストを使用する、または既にそこにあるテキストを返すものは何もない。したがって、必要なテキストをフェッチして.text(string)から、上記のように、設定するオブジェクトのメソッドにそれを配置する必要があります。

これを試して：

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

これも機能する短いバージョンです：

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

jQueryが少ない場合：

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

this.options[this.selectedIndex].value プレーンなJavaScriptです。

（出典：German SelfHTML）

次のコードを試してください

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

選択した要素の数を知るには、

$("select option:selected").length

選択したすべての要素の値を取得するには、次を使用します

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

これは私のために働きました：

$("#SelectedCountryId_option_selected")[0].textContent

最初の部分は、次のようなドロップダウンメニューから要素を取得することです。

<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>

あなたは使うでしょう：

$（ 'p'）。html（iterations）; または$（ 'div'）。html（iteration）;

次のようなテキストフィールドに入力する場合：

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

あなたは使うでしょう：

$（ '＃textform'）。text =反復;

もちろん、上記のすべてを少ない手順で実行できます。それを理解しやすい手順にすべて分解すると、人々が学ぶのに役立つと思います...これが役に立てば幸いです！

selectedOptionsプロパティ（HTML5）を使用すると、選択したオプションを取得できます

document.getElementbyId("id").selectedOptions; 

これを行うことでJQueryを実現できます

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

または

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

プロパティには、この1つの選択されたオプションに類似したHTMLCollection配列が含まれています

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

または複数選択

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

上記は非常にうまく機能しますが、ドロップダウンテキストのjQueryタイプキャストを見逃しているようです。それ以外の場合.val()は、入力テキストタイプ要素のテキストを設定するために使用することをお勧めします。これらの変更により、コードは次のようになります。

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

これがすでにあり、jqueryを使用している場合、これがあなたの答えになります：

$（$（this）[0] .selectedOptions [0]）。text（）

この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);