javascript - jQuery 获取未填充的空文本框的数量

Question

我试图解决另一个人的 jQuery 问题，但遇到了我自己的问题。

为了解决这个问题，我需要确定空文本框的数量。我认为最好的解决方案是使用 element[attribute='value'] 选择器，但这不起作用。

alert($("input[val='']").length);

即使还有其他 3 个空文本框，我总是得到 0。空文本框的值应等于空字符串。

这是我的 fiddle

http://jsfiddle.net/04gqaLog/

HTML

<input type="text" /></br>
<input type="text" /></br>
<input type="text" /></br>
<input type="text" />

jQuery

$(document).ready(function() {
    var sum = 0;
    var boxesFilled = 0;
    $("input").on("change", function() {
        sum += +$(this).val();
        boxesFilled += 1;
        alert($("input[val='']").length);
    });
});

Answer 1

第一个问题是您将 value 属性引用为 val。这些被视为两个不同属性。

下一个问题是某些输入元素可能没有 value 属性。因此，您需要专门检查或检查该值是否为假

    var emptyInputs = $('input').filter(function() {
      return !$(this).val();
    });
    console.log(emptyInputs.length);

$(document).ready(function() {
  var sum = 0;
  var boxesFilled = 0;
  $("input").on("change", function() {
    sum += +$(this).val();
    boxesFilled += 1;
    var emptyInputs = $('input').filter(function() {
      return !$(this).val();
    });
    console.log(emptyInputs.length);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" />
</br>
<input type="text" />
</br>
<input type="text" />
</br>
<input type="text" />