JavaScript 验证用户名和密码

Question

要求是：检查用户输入以字符 [a-zA-Z] 开头的用户名，并检查用户输入包含 3 个或更多字母数字字符的用户名。要求用户输入 8 个或更多字符的密码，其中至少 1 个大写字母和 1 个数字以及 1 个特殊字符 (/ - +!@#$^& )。AND密码与输入的确认密码相同。我已经完成了电子邮件和所需的输入，但对如何在 JavaScript 中执行此操作感到困惑。这就是我所做的：<script>function validateForm() {        var nameRegex = /^[a-zA-Z\-]+$/;    var passregex= /^(?=.{8,})(?=.*[0-9])(?=.*[A-Z])(?=.*[@#$%^&+*!]).*$/;    var uname = document.myForm.firstName.value.match(nameRegex);    var firstpassword=document.myForm.password.value;      var secondpassword=document.myForm.password2.value;        var firstpassword = document.myForm.password.value.match(passregex);        if(uname == null){        if(uname.length<3){        alert("Username length should be atleast 3 and make sure it starts with A-Z");}        return false;  }  elseif(firstpassword==null){    if(firstpassword.length<8){        alert("Password must be at least 6 characters long.");        return false;      }    elseif(firstpassword==secondpassword){      alert("Please enter same password");        return false;      }  }}</script>

Answer 1

function validateForm() {

  if (document.myForm.userName.value && document.myForm.password.value && document.myForm.confirmpassword.value) {

    if (document.myForm.password.value === document.myForm.confirmpassword.value) {

      if (document.myForm.userName.value.length < 3) {

        alert("Username length should be atleast 3 and make sure it starts with A-Z");

        return false;

      } else if (document.myForm.password.value.length < 8) {

        alert("Password must be at least 6 characters long.");

        return false;

      } else {

        if (new RegExp(/^[A-Za-z][A-Za-z0-9]+$/).test(document.myForm.userName.value) === false) {

          alert('Username begins with a character[a-zA-Z] ');

          return false;

        } else if (new RegExp(/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[#$@!%&*?])[A-Za-z\d#$@!%&*?]{8, 30}$ /).test(document.myForm.password.value)) {

          alert("password is 8 or more characters where at-least 1 uppercase letter And 1 number AND 1 of the special characters (/-+!@#$^&)");

          return false;

        } else {

          alert('Success !');

          return true;

        }

      }

    } else {

      alert("password & confirm password not match!");

      return false;

    }

  } else {

    alert("Please add valid credentials..");

    return false;

  }

}

<form name="myForm" action="main.html" method="post">

  <!--  onSubmit="return validateForm();" -->

  <label>User name</label><br />

  <input type="text" name="userName" placeholder="userName" />

  <br />

  <label>Password</label><br />

  <input type="password" name="password" placeholder="password" />

  <br />

  <label>Confirm Password</label><br />

  <input type="password" name="confirmpassword" placeholder="confirm password" />

  <br />

  <input type="button" value="Login" onclick='validateForm();' />

</form>

注意：-我已经添加了您的所有要点，如果出现问题请告诉我！

Answer 2

尝试使用 jQuery 验证（https://jqueryvalidation.org/）。它可以很容易地实现。