如何使用 jQuery 透過文字描述選擇下拉選項？

使用jQuery 透過文字描述設定選定的下拉選項

在Web 開發領域，在select 中選擇一個元素基於其文字描述的控制經常出現。雖然透過值設定選項很簡單，但找到給定文字描述的相應值可能是一個挑戰。

查詢的起源

需要此功能源自 JavaScript 變數保存文字字串的情況，目的是選擇文字與此字串相符的下拉選項。與使用 $("#my-select").val(myVal) 語法的基於值的選擇不同，此任務需要更複雜的方法。

解決 Enigma

對於 jQuery 1.6 以上版本，解決方案在於利用 filter() 和 prop() 方法。 filter() 方法篩選選擇控制項中的所有選項，將它們的文字描述與所需的字串進行比較。然後，prop() 方法將產生的元素作為目標，將其 selected 屬性設為 true。

範例實作

考慮具有兩個選項的選擇控制： ‘一’和‘二’。以下程式碼說明如何使用基於文字的方法選擇帶有文字「Two」的選項：

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

此程式碼根據其文字有效地在下拉清單中選擇「Two」選項描述，即使不知道其價值。

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