☰

jQuery - テキストの説明を使用して選択コントロールの選択値を設定する 質問する

tag-icon • tag-icon javascript jquery
jQuery - テキストの説明を使用して選択コントロールの選択値を設定する 質問する

選択コントロールがあり、JavaScript 変数にテキスト文字列があります。

jQuery を使用して、選択コントロールの選択された要素を、私が持っているテキスト説明 (持っていない値ではなく) を持つ項目に設定したいと思います。

値で設定するのは非常に簡単です。例:

$("#my-select").val(myVal);

しかし、テキストの説明を介してそれを実行するのはちょっと困惑しています。テキストの説明から値を取得する方法があるはずですが、私の脳は金曜日の午後で疲れすぎていて、それを理解できません。

ベストアンサー1

jQuery v1.6+ の説明による選択

var text1 = 'Two';
$("select option").filter(function() {
  //may want to use $.trim in here
  return $(this).text() == text1;
}).prop('selected', true);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

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

jQuery バージョン 1.6 未満、1.4 以上

var text1 = 'Two';
$("select option").filter(function() {
  //may want to use $.trim in here
  return $(this).text() == text1;
}).attr('selected', true);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>

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

この方法は1.6以上1.9未満のバージョンでは機能しますが、1.6以降では非推奨となっています。動作しないでしょうjQuery 1.9 以降。

以前のバージョン

val()両方のケースを処理する必要があります。

$('select').val('1'); // selects "Two"
$('select').val('Two'); // also selects "Two"
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>

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

おすすめ記事