Javascript如何在html表单提交中使用多个函数来验证

Question

Html 形式让我抓狂。我有一个函数可以检查密码是否不匹配以及指定的用户名是否已被使用。如果您通过了这两项检查，那么表单应该提交，但事实并非如此。

这不是数据库问题。我已经检查过了，连接得很好。

在删除双重 onsubmit 参数时，checkname 中的 post 和表单中的 post 都可以工作。如果有人有任何想法请告诉我:)

Here is link 我目前正在工作的项目:

功能与形式:

function validatePassword() {
  var pass1 = document.getElementById("password").value;
  var pass2 = document.getElementById("confirm_password").value;

  if (pass1 != pass2) {
    alert("Passwords Do not match");
    document.getElementById("password").style.borderColor = "#E34234";
    document.getElementById("confirm_password").style.borderColor = "#E34234";
    return false;
  } else {
    return true;
  }
}

function checkname() {
  var name = document.getElementById("username").value;

  if (name) {
    $.ajax({
      type: 'post',
      url: 'checkdata.php',
      data: {
        user_name: name,
      },
      success: function(response) {
        $('#name_status').html(response);
        if (response == "OK") {
          return true;
        } else {
          return false;
        }
      }
    });
  } else {
    $('#name_status').html("");
    return false;
  }
}


function checkall() {
  var namehtml = document.getElementById("name_status").innerHTML;


  if ((namehtml) == "OK") {
    return true;
  } else {
    return false;
  }
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<font size=4><b>Customer sign up</b></font>
<form name="input" action="customer_insert.php" onsubmit=" return !!(validatePassword() & checkall());" method="post">
  <br> Username: <input type="text" maxlength="45" name="username" id="username" onchange="checkname();" required="required">
  <span id="name_status"></span>
  <br> Password: <input type="password" maxlength="128" name="passwd1" id="password" required="required">
  <br> Retype Password: <input type="password" maxlength="128" name="passwd2" id="confirm_password" required="required">
  <br> First Name: <input type="text" maxlength="45" name="firstname" required="required">
  <br> Last Name: <input type="text" maxlength="45" name="lastname" required="required">
  <br> E-mail: <input type="email" name="email" required="required">
  <input type="submit" name="Signup" value="Signup">
</form>

Answer 1

已修复。问题是在条件中直接使用 checkname() 会导致未定义的返回，因此永远无法满足条件。现在我采用旧的 checkall() 的一部分并将其与您的验证方法集成。这有效。谢谢!

function validateForm(){
    var a = validatePassword();
    var b;

    var namehtml=document.getElementById("name_status").innerHTML;


    if(namehtml=="OK")
    {
            b = true;
    }
    else
    {
            b = false;
    }


    if(a && b){

            return true;

    }
    else{

            return false;
    }
}