JavaScript 验证用户名和密码

Question

要求是：

1. 检查用户输入以字符 [a-zA-Z] 开头的用户名，并检查用户输入包含 3 个或更多字母数字字符的用户名。

2. 要求用户输入 8 个或更多字符的密码，其中至少 1 个大写字母和 1 个数字以及 1 个特殊字符 (/ - +!@#$^& )。

3. 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() {&nbsp; if (document.myForm.userName.value && document.myForm.password.value && document.myForm.confirmpassword.value) {&nbsp; &nbsp; if (document.myForm.password.value === document.myForm.confirmpassword.value) {&nbsp; &nbsp; &nbsp; if (document.myForm.userName.value.length < 3) {&nbsp; &nbsp; &nbsp; &nbsp; alert("Username length should be atleast 3 and make sure it starts with A-Z");&nbsp; &nbsp; &nbsp; &nbsp; return false;&nbsp; &nbsp; &nbsp; } else if (document.myForm.password.value.length < 8) {&nbsp; &nbsp; &nbsp; &nbsp; alert("Password must be at least 6 characters long.");&nbsp; &nbsp; &nbsp; &nbsp; return false;&nbsp; &nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; if (new RegExp(/^[A-Za-z][A-Za-z0-9]+$/).test(document.myForm.userName.value) === false) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; alert('Username begins with a character[a-zA-Z] ');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return false;&nbsp; &nbsp; &nbsp; &nbsp; } else if (new RegExp(/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[#$@!%&*?])[A-Za-z\d#$@!%&*?]{8, 30}$ /).test(document.myForm.password.value)) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; alert("password is 8 or more characters where at-least 1 uppercase letter And 1 number AND 1 of the special characters (/-+!@#$^&)");&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return false;&nbsp; &nbsp; &nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; alert('Success !');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return true;&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; alert("password & confirm password not match!");&nbsp; &nbsp; &nbsp; return false;&nbsp; &nbsp; }&nbsp; } else {&nbsp; &nbsp; alert("Please add valid credentials..");&nbsp; &nbsp; return false;&nbsp; }}<form name="myForm" action="main.html" method="post">&nbsp; <!--&nbsp; onSubmit="return validateForm();" -->&nbsp; <label>User name</label><br />&nbsp; <input type="text" name="userName" placeholder="userName" />&nbsp; <br />&nbsp; <label>Password</label><br />&nbsp; <input type="password" name="password" placeholder="password" />&nbsp; <br />&nbsp; <label>Confirm Password</label><br />&nbsp; <input type="password" name="confirmpassword" placeholder="confirm password" />&nbsp; <br />&nbsp; <input type="button" value="Login" onclick='validateForm();' /></form>注意：-我已经添加了您的所有要点，如果出现问题请告诉我！

Answer 2

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