jQuery:选择具有特定val()的所有'select'元素

Question

有没有人知道一个简单的方法,使用jQuery,选择<select>其val()属性产生一定值的所有元素？

我正在尝试做一些验证逻辑,并希望只用一个选择器选择所有这些元素,然后将警告类应用于他们的每个父母.我知道如果选择所有元素后该怎么做,但我没有看到处理这种情况的选择器.

我是否必须将所有<select>元素选择到选择器中,然后遍历它们并检查它们的每个值？我希望有一种更简单的方法.

谢谢.

Answer 1

为什么不起作用select[value=x]？首先,因为<select>实际上没有value属性.选择框没有单一值:可能没有选定的选项(通常不应该存在,但至少可以存在IE),并且在a中<select multiple>,可以有任意数量的选定选项.

即使input[value=x]不工作,即使<input> 确实有一个value属性.嗯,它确实有效,它只是不按你的想法去做.它获取value="..."HTML中属性的值,而不是您在表单中输入的当前值.该value="..."属性实际上对应于defaultValue属性而不是value.

类似地,option[value=x][selected]不起作用,因为它正在检查<option selected>HTML源(selected属性 - > defaultSelected属性)中的属性,而不是选项的当前选择性(selected 属性非属性) - 自页面加载后可能已更改.

除了IE,它得到的value,selected等形式属性错误.

除了(再次):Tesserex的示例似乎可行,其原因在于它使用的是非标准的jQuery特定选择器:has.这会导致querySelectorAll现代浏览器的本机方法失败,因此jQuery会回退到自己的(本机JavaScript,慢速)选择器引擎.这个选择器引擎有一个错误,它会混淆属性的属性,允许[value=x]做你期望的事情,而不是像它应该的那样失败!(更新:在较新的jQuery版本中可能不再是这种情况.)

总结:表单字段状态检查和选择器不混合.除了这些问题之外,您还必须担心转义问题 - 例如,如果要测试的值包含引号或方括号,该怎么办？

所以相反,是的,你应该手动检查它.例如使用过滤器:

$('select').filter(function() {
    return $(this).val()==='the target value';
}).parent().addClass('warning');

(HTML5中有一个value 属性,现代浏览器支持,当你阅读它时会给你第一个选择的值<option>.jQuery val()在这里使用是安全的,因为它提供了获取第一个选择选项的相同方法,即使在浏览器上也是如此不支持这个.)

Answer 2

现有的答案不适用于选择标签,但我发现了一些确实存在的问题.要求选择具有所选选项的选项.

$("select:has(option[value=blah]:selected)")