根据条件阻止表单提交

Question

我已经使用Jquery构建了一个表单验证器，它提示用户输入密码要求，以及当他们键入密码表单时是否满意。这段代码按照我的意愿运行，如下所示：

表单验证

 $('input[type=password]').keyup(function () {
        // set password variable
        var pwd = $(this).val();
        //validate the length
        if (pwd.length < 8) {
            $('#length').removeClass('glyphicon glyphicon-check valid').addClass('glyphicon glyphicon-check invalid');
        } else {
            $('#length').removeClass('glyphicon glyphicon-check invalid').addClass('glyphicon glyphicon-check valid');
        }
        //validate capital letter
        if (pwd.match(/[A-Z]/)) {
            $('#capital').removeClass('glyphicon glyphicon-check invalid').addClass('glyphicon glyphicon-check valid');
        } else {
            $('#capital').removeClass('glyphicon glyphicon-check valid').addClass('glyphicon glyphicon-check invalid');
        }

        //validate number
        if (pwd.match(/[0-9]/)) {
            $('#number').removeClass('glyphicon glyphicon-check invalid').addClass('glyphicon glyphicon-check valid');
        } else {
            $('#number').removeClass('glyphicon glyphicon-check valid').addClass('glyphicon glyphicon-check invalid');
        }

    }).focus(function () {
        $('#pwd_info').show();
    }).blur(function () {
        $('#pwd_info').hide();
    });

});

现在，我想阻止在满足这些要求之前提交该按钮，并且我已将以下函数添加到我的文档中尝试这样做：

停止提交表单

$(document).ready(function () {

    $('#signup_btn').submit(function (e) {
        var pwd = $('input[type=password]').val();
        if (pwd.length < 8) {
            e.preventDefault();
        }
        if (pwd.match(/[A-Z]/)) {
            e.preventDefault();
        }
        if (pwd.match(/[0-9]/)) {
            e.preventDefault();
        } 
else
            return true;



    });

当我尝试根据我的条件（1个数字，1个大写，最少8个字符）提交无效密码时，它仍允许我通过。有人可以指出我正确的方向吗？

Answer 1

如果有任何验证失败，您希望捕获submit事件，执行验证和return false。

＆＃13;

＆＃13;

$('#signup_btn').submit(function(e) {
  var err = 0;
  $('input[type="text"]').each(function() { 
    if (!$(this).val()) {
      err = 1;
    }
  })
  if (err != 0) {
    console.log('errors');
    return false;
  }
  console.log('submitted');
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="signup_btn">
  <input type="text" placeholder="needs text">
  <input type="text" placeholder="needs text">
  <input type="submit">
</form>

＆＃13;

＆＃13;

＆＃13;

Answer 2

$(document).ready(function () {

$('#signup_btn').submit(function (e) {
    var pwd = $('input[type=password]').val();
    if (pwd.length < 8) {
        return false;
    }
    if (pwd.match(/[A-Z]/)) {
        return false;
    }
    if (pwd.match(/[0-9]/)) {
        return false;
    }   
else
        return true;



});