Question

我有以下jQuery代码，Im使用了以下jQuery代码进行表单验证，并且可以正常工作，但Typescript不喜欢它，Im对Javascript来说是菜鸟（Typescript超越了noob）。

还有另一种无需使用长度就可以成功编写以下内容的方法吗？

 $('input[required], select[required], textarea[required]').on('change, input', function(e) {
    var rc = 0;
    $('[required]').each(function() {
      if($(this).val().length === 0) {
        rc++;
      }
    });
    if(rc === 0) {
      $('button').prop("disabled", false);
    } else {
      $('button').prop("disabled", true);
    }
});

Answer 1

如果您坚持不检查长度，请尝试使用if($(this).val().length === 0)而不是if(!$(this).val())。这是检查字符串是否为空的另一种方法，因为在JavaScript中，空字符串是“假”值。

Answer 2

您可以只检查一个空字符串，因为无论如何它都将得出false。 if(!$(this).val())或仅使用!!$(this).val()返回布尔值

所以您的代码可能类似于

$('input[required], select[required], textarea[required]').on('change, input', function(e) {
    $('[required]').each(function() {
      var disabled = !!$(this).val();
      if(disabled) return false;
    });
    $('button').prop("disabled", disabled);
});

Answer 3

您应该首先trim（删除所有结尾的空格），以确保它不仅是空格。

if(!$(this).val().trim()){
  //String is null, empty, or only spaces
}

演示：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="inputToCheck"><button onClick="check()">Check</button>
<p/>
<span id="result"></span>
<script>
var inputToCheck = $('#inputToCheck');
var result = $('#result');
function check(){
  if(!inputToCheck.val().trim()){
   alert("Invalid input!");
   result.html("<b style='color: red;'>Input is not valid (empty or only whitespace).</b>");
  } else {
    result.text("Input is not null, empty, or only white space.");
  }
}
</script>

jQuery-如何在不使用长度的情况下写？

3 个答案: