Question

我希望有一个超级简单的验证脚本，它将表单上的总输入与表单上的值的总输入相匹配。你能帮忙解释为什么以下不起作用，并建议一个有效的解决方案吗？

填写一个或多个输入，然后点击＆＃34;提交＆＃34;。我希望看到填充输入的数量作为结果。到目前为止，它只显示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]引用值属性，它与值属性非常不同。

属性在您键入时更新，属性保持不变。这意味着顺便说一句，你可以elem.value = elem.getAttribute("value")来“重置”一个表单元素。

就个人而言，我会做这样的事情：

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

Answer 2

试试这个：http://jsfiddle.net/justincook/d7DDu/1/

$('#btn-submit').bind('click', function() {
    var x = 0;
    $(':input').each(function(){
        if(this.value.length > 0){ x++; };
    });
    $('#count').html(x);
});

如何计算页面上值的输入总数？

2 个答案: