HTML選択要素の選択されたオプション値を取得および設定するためのjQuery

jQueryを使用して、select要素（ドロップダウンリスト）の選択された値を取得および設定しようとしています。

私が試してみ$("#myId").find(':selected').val()ました$("#myId").val()が、両方とも未定義を返します。

この問題への洞察は大歓迎です。

あなたがそれを持っている方法は、現時点では正しいです。selectのidがあなたの言うことではないか、domに問題があります。

要素のIDを確認し、また、であなたのマークアップを検証を確認し、ここ W3Cで。

有効なdomがないと、jQueryはセレクターで正しく動作できません。

IDが正しく、DOMが検証する場合、以下が適用されます。

選択オプション値を読み取るには

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

選択オプション値を設定するには

$('#selectId').val('newValue');

選択したテキストを読むには

$('#selectId>option:selected').text();

select要素の実際のselectedIndexプロパティを取得/設定するには、以下を使用します。

$("#select-id").prop("selectedIndex");

$("#select-id").prop("selectedIndex",1);

$('#myId').val() 私が試してみると失敗して、それを行うべきです：

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

で設定するJQM場合は、必ず更新してUIください。

$('#selectId').val('newValue').selectmenu('refresh', true);

$("#myId").val()myid選択要素IDであれば動作するはずです！

これにより、選択したアイテムが設定されます。 $("#myId").val('VALUE');

次のように、SELECTタグを使用してドロップダウンリストを作成したとします。

<select id="Country">

次に、JQueryを使用してドロップダウンから選択した値を確認したい場合は、次の行を入力してその値を取得します。

var result= $("#Country option:selected").text();

正常に動作します。

私はこれが古いことを知っていますが、Razorを使用したことがあるので、どんなに頑張っても動作しませんでした。属性に「text」と「html」のどちらを使用しても、「undefined」として戻ってきました。最後に、「data-value」属性をオプションに追加しましたが、それは問題なく読み取れました。

 <option value="1" data-value="MyText">MyText</option>

 var DisplayText = $(this).find("option:selected").attr("data-value");

$（ "#myId option：selected"）.text（）; ドロップダウン要素で選択したテキストが表示されます。どちらの方法でも、.val（）に変更できます。それの価値を得るために。以下のコーディングを確認してください

<select id="myId">
    <option value="1">Mr</option>
    <option value="2">Mrs</option>
    <option value="3">Ms</option>`
    <option value="4">Dr</option>
    <option value="5">Prof</option>
</select>

これを試して

$('#your_select_element_id').val('your_value').attr().add('selected');