javascript - 如何计算页面上具有值的输入总数？

Question

我希望有一个 super 简单的验证脚本，可以将表单上的总输入与表单上具有值的总输入相匹配。您能否帮助解释以下内容为何不起作用，并提出可行的解决方案？

fiddle :http://jsfiddle.net/d7DDu/

填写一项或多项输入并点击“提交”。我想查看填写的输入数量作为结果。到目前为止它只显示 0。

HTML:

<input type="text" name="one">
<input type="text" name="two">
<input type="text" name="three">
<textarea name="four"></textarea>
<button id="btn-submit">Submit</button>
<div id="count"></div>

JS:

$('#btn-submit').bind('click', function() {
    var filledInputs = $(':input[value]').length;
    $('#count').html(filledInputs);
});

Answer 1

[value] 指的是值attribute，它与值property有很大的不同。

属性会在您键入时更新，属性保持不变。这意味着您可以通过 elem.value = elem.getAttribute("value") 来“重置”表单元素。

就我个人而言，我会这样做:

var filledInputs = $(':input').filter(function() {return !!this.value;}).length;