[英]JavaScript form validation second if statement not working
I'm starting simple JavaScript form validation. 我正在开始简单的JavaScript表单验证。 I write two statement, first if statement working well but second one is not.
我写了两个语句,第一个是if语句运行良好,第二个不是。 But this two if statement separately working.
但是这两个if语句分别起作用。 I don't understand what I'm wrong.
我不明白我的错。 Here is the HTML code:
这是HTML代码:
<form id="loginForm" name="loginForm" method="post" action="my-profile.html">
<div class="form-group">
<label>Email</label>
<input type="email" name="email" id="eMail" placeholder="abcde00@example.com" class="form-control" required="required" />
<span class="erRor" id="error1">Please input valid email address</span>
</div>
<div class="form-group">
<label>Password</label>
<input type="password" placeholder="Password" name="password" id="pasSword" class="form-control" required="required" />
<span class="erRor" id="error2">Invalid email and password</span>
<span class="erRor" id="error3">This field should not be empty</span>
</div>
<div class="form-group">
<button type="submit" onclick="return validate();">Login</button>
</div>
</form>
JavaScript code here: 此处的JavaScript代码:
function validate(){
/* email validation */
var changeColor = document.getElementById("eMail");
var error1 = document.getElementById("error1");
var email1 = document.loginForm.email;
var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
if(!re.test(email1.value)){
changeColor.style.border = "2px solid red";
error1.style.display = "block";
return false;
}
/* empty fild check for password field */
var pas = document.getElementById("pasSword");
var error3 = document.getElementById("error3");
var password = document.loginForm.password;
if(password.value === ""){
pas.style.border = "2px solid red";
error3.style.display = "block";
return false;
}
}
Please help me out of this. 请帮助我。
Note: I want to learn " AS YOU TYPE JavaScript for validation ". 注意:我想学习“ 在验证时输入JavaScript ”。 I haven't find any proper tutorial or desiccation.
我没有找到任何合适的教程或干燥剂。
You are using return false
, hence second validation is not working. 您正在使用
return false
,因此第二次验证不起作用。
Try this: 尝试这个:
var valid = true;
if(conditoin_one){
valid = false;
// update error element
}
if(conditoin_two){
valid = false;
// update error element
}
return valid;
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.