ホームページ  >  記事  >  ウェブフロントエンド  >  jQueryを使用してテキストの説明によってドロップダウンのオプションを選択する方法?

jQueryを使用してテキストの説明によってドロップダウンのオプションを選択する方法?

DDD
DDDオリジナル
2024-11-03 12:53:03991ブラウズ

How to Select an Option in a Dropdown by Text Description with jQuery?

jQuery でテキストの説明を使用して選択コントロールで選択された値を設定する方法

Web アプリケーションで選択コントロールを操作するときに、次のような問題が発生する可能性があります。選択した要素を値ではなくテキストの説明に基づいて設定する必要がある場合。 jQuery の val() メソッドを使用して値を設定するのは簡単ですが、テキストの説明による選択には別のアプローチが必要です。

jQuery バージョン 1.6 以降では、次のコード スニペットを使用してこれを実現できます。

<code class="javascript">var text1 = 'Two';
$("select option").filter(function() {
  //may want to use $.trim in here
  return $(this).text() == text1;
}).prop('selected', true);</code>

このコードは、選択コントロール内のすべてのオプションを選択し、テキストに基づいてフィルターします。フィルター関数は、各オプションのテキストを指定された text1 値と比較します。一致するオプションが見つかると、その selected プロパティが true に設定されます。

たとえば、次の選択コントロールについて考えてみましょう:

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

テキスト「」のオプションを選択したい場合jQuery を使用して Two" を実行するには、上記のコード スニペットを次のコードとともに使用できます:

<code class="html"><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script></code>

これにより、ドロップダウン リストで "Two" オプションが選択されます。

以上がjQueryを使用してテキストの説明によってドロップダウンのオプションを選択する方法?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。