为什么验证密码字段验证不起作用?

时间:2014-06-01 11:56:33

标签: javascript

我是网络编程的新手你可以告诉我下面的代码有什么问题吗?

   <!doctype html>
   <html>
   <head>
   <title>Form Validation</title>
   <script type="text/javascript">
   function validate (form) {
   // valriable declaration
   var returnValue = true;
   var username = form.txtUserName.value;
   var password1 = form.txtPassword.value;
   var password2 = form.txtPassword2.value;
   // check for UserName length
   if (username.length < 6) {
   returnValue = false;
   alert("Your username must be at least\n6 characters long.\nPlease try again.");
   frmRegister.txtUserName.focus();
   };
   // check for password length
   if (password1.length < 6) {
   returnValue = false;
   alert("Your password must be at least\n6 characters long.\nPlease try again.");
   frmRegister.txtPassword.value = "";
   frmRegister.txtPassword2.value = "";
   frmRegister.txtPassword.focus();
   };
   // check for match of password field
   if (password1.value != password2.value) {
   returnValue = false;
   alert("Your password entries did not match.\nPlease try again.");
   frmRegister.txtPassword.value = "";
   frmRegister.txtPassword2.value = "";
   frmRegister.txtPassword.focus();
   };
   return returnValue;
   }
   </script>
   </head>
   <body>
   <form method="post" name="frmRegister" action="register.html" onsubmit="return validate(this);">
   <div><label for="txtUsername">UserName : </label>
   <input type="text" name="txtUserName" id="txtUserName" size="12" />
   </div>
   <div><label for="txtPassword">Password : </label>
   <input type="text" name="txtPassword" id="txtPassword" size="12" />
   </div>
   <div>
   <label for="txtPassword2">Confirm your password : </label>
   <input type="text" name="txtPassword2" id="txtPassword2" size="12" />
   </div>
   <div>
   <input type="submit" value="Log in" />
   </div>
   </form>
   </body>
   </html>

1 个答案:

答案 0 :(得分:0)

首先停止使用event handler的回复。 将您的代码转换为 <form ... onsubmit="validate(event,this)"> 将您的功能更改为validate(event,form);

无论你觉得哪种形式都不应该提交.. 写:

event.preventDefault()

而不是return false

示范: http://codepen.io/anon/pen/kGmeL