jQuery值属性选择器未返回正确数量的元素

Question

我有一个程序可以在按键启动后生成计数。 jQuery代码：

$('.today').keyup(function() {
    var Presents = $('input[value="/"]:visible');
    $("#counter").html( "Present: " + Presents.length );
});

HTML：

<input type="text" id="1" name="1" class="today" value="/">
<input type="text" id="2" name="2" class="today" value="/">
<input type="text" id="3" name="3" class="today" value="/">
<p id="counter"></p>

第一次按键后计数器标签将显示 3。当我更改文本框中的值时，计数器框中的值不会更改。 例如。当我将文本框 3 的值变为 x 时，

标签现在应该包含数字 2。目前这不会改变。

Answer 1

您正在使用属性选择器，但是当您更改输入值时，它不会更改属性；只是财产。您可以使用filter() 来获取您需要的内容：

$('.today').keyup(function() {
    var Presents = $('input:visible').filter(function(){
      return this.value == "/";  
    });
    $("#counter").html( "Present: " + Presents.length );
});

JSFiddle

如果您需要更新属性本身，只需将以下内容添加到事件处理程序的顶部即可：

$(this).attr('value',this.value);

JSFiddle

但这对我来说似乎很混乱。另外，我相信filter() 无论如何都会比属性选择器更快。