如何使用 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中文网其他相关文章！