如何使用jQuery移除下拉框指定选项文本末尾的星号？

我有一个这样结构的下拉选择框：

<select name="decision">
  <option value="">** Select **</option>
  <option value=0>No</option>
  <option value=1>Yes*</option>
</select>

根据用户之前的选择操作，下拉框里的“Yes”或“No”选项文本末尾可能会带有星号（*）。现在我需要在另一个表单字段的onChange事件触发后，把这些“Yes”或“No”选项末尾的星号移除。

我原本的思路是：选中包含星号（*）但不包含双星号（）的选项（这样就能排除默认的“ Select **”选项），然后修改它的文本内容去掉星号。但我写的jQuery代码没法正常运行：

$('[name=decision] option:contains("*"):not:contains("**")').text($.this.text().replace("*",""));

我感觉要么是差一点细节没做对，要么是整体方法有问题，希望能得到技术帮助。

你的思路其实没大问题，就是两个小细节没处理对，调整一下就能正常工作了：

1. 修复选择器的语法错误 #

你写的:not:contains("**")是错误的写法——:not()是一个筛选选择器，它的括号里需要包裹具体的筛选条件，所以正确的写法应该是:not(:contains("**"))，这样才能准确排除包含**的默认选项。

2. 逐个处理选项的文本替换 #

直接用text($.this.text().replace(...))是行不通的，因为$.this并不是当前匹配元素的引用，而且text()如果传固定值会把所有匹配元素的文本改成同一个内容。我们需要给text()传一个回调函数，jQuery会自动遍历每个匹配的选项，把当前元素的原始文本传进来，处理后返回新文本。

修正后的完整代码 #

// 替换成你实际的另一个表单字段选择器
$('input[name="other-field"]').on('change', function() {
  $('[name="decision"] option:contains("*"):not(:contains("**"))').text(function(index, originalText) {
    // 只移除文本末尾的星号，避免误删中间的星号
    return originalText.replace(/\*$/, '');
  });
});

额外优化：精准匹配末尾星号 #

我用了正则表达式/\*$/来替换，而不是简单的replace("*", "")，这样只会移除文本最后一位的星号。比如如果有选项文本是Yes*abc，只会去掉最后的*变成Yesabc，而不会把所有*都删掉，更精准。

快速测试方法 #

你可以先在浏览器控制台运行下面的代码，看看能不能正确选中目标选项：

$('[name="decision"] option:contains("*"):not(:contains("**"))')

如果能选中带有单个星号的选项，说明选择器没问题，剩下的文本替换逻辑就可以正常工作了。

内容的提问来源于stack exchange，提问作者CF_HoneyBadger