首頁 > web前端 > js教程 > 如何使用 jQuery 透過文字描述在下拉清單中選擇選項?

如何使用 jQuery 透過文字描述在下拉清單中選擇選項?

DDD
發布: 2024-11-03 12:53:03
原創
1059 人瀏覽過

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>
登入後複製

如果要選擇帶有文字「的選項」 Two” 使用jQuery,您可以將上面的程式碼片段與以下程式碼一起使用:

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

這將導致在下拉清單中選擇「Two」選項。

以上是如何使用 jQuery 透過文字描述在下拉清單中選擇選項?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板