jQuery 选择器 [名称=值] 不起作用

Question

我是 jQuery 的新手。我在使用 [name=value] 选择器时遇到问题。这是 HTML:

<input type="number"/>

很简单，对吧？这是 JS:

$("input").val(100);
$("input[value='100']").val(200)​

结果是:脚本的第一行有效，但第二行无效。(Chrome、FF、IE9)这两条线都适用于 IE8。这是怎么发生的？顺便说一句，我正在使用 jQuery1.7.2。或者你可以在 http://jsfiddle.net/wzKNV/ 上测试上面的代码

Answer 1

attribute-equals 选择器检查属性，但 .val() 仅更改属性，因此选择器不会查看更新。

jQuery/Sizzle 默认强制执行此“仅属性”行为的 native querySelectorAll 方法。

如果您破坏 querySelectorAll 的选择器，因此必须使用 Sizzle，它将起作用...

// v------made it a non-standard Sizzle selector
$(":input[value='100']").val(200);

这是因为 Sizzle 选择器不一定与 qSA 选择器兼容。当然，这稍微改变了选择器的含义，但对于说明很有用。

演示: http://jsfiddle.net/wzKNV/3/

<小时/>

要保持它使用标准选择器(在我看来这是一个好主意)，您可以使用filter()代替...

$("input").filter(function() { return this.value === '100'; })
          .val(200);

演示: http://jsfiddle.net/wzKNV/4/