我尝试了很多方法,但是当点击提交按钮时,它直接移动到下一页,而不通过javascript在客户端验证。请告诉我这个问题的解决方案。
以下是代码:
function teacherValidateForm(){
var tuid=document.getElementById("tusername");
var tnme=document.getElementById("tname");
var tmail=document.getElementById("temail");
var tpsd=document.getElementById("tpssswod");
var tiname=document.getElementById("tiname");
function validateTID(tuid){
var message= "Username must start with a letter and must be of minimum 5 letters and '_' and '.' is allowed";
if((!tuid.match(/^[[A-Za-z][A-Za-z0-9/._]*]{5,}$/)) || tuid.value==""){
document.getElementById(uname).innerHTML=message;
return false;
}
else return true;
}
function validateTName(){
var message="Teacher's name muct not contain special characters and numbers";
if((!tnme.match(/^[A-Za-z]*\s{1}[A-Za-z]*$/) || tnme.value==""){
document.getElementById(name).innerHTML=message;
return false;
}else return true;
}
function validateTEmail(){
var message="Enter a valid email";
if((!tmail.match(/^[A-Za-z\._\-0-9]*[@][A-Za-z]*[\.][a-z]{2,4}*$/) || tmail.value==""){
document.getElementById(email).innerHTML=message;
return false;
}else return true;
}
function validateTPass(){
var message="Password must contain special cahacters, one catital letter atleast and must be mininum 8 letters";
if((!tpsd.match(/^(?=.*[A-Za-z])(?=.*\d)(?=.*[$@$!%*#?&])[A-Za-z\d$@$!%*#?&]{8,}$/) || tpsd.value==""){
document.getElementById(password).innerHTML=message;
return false;
}else return true;
}
function validateTName(){
var message="Institute's name muct not contain special characters and numbers";
if((!tiname.match(/^[A-Za-z]*\s{1}[A-Za-z]*$/) || tnme.value==""){
document.getElementById(iname).innerHTML=message;
return false;
}else return true;
}
}

<body>
<div class="container-fluid" id="home">
<div class="text-center ">
<p></p><br/><br/><br/><br/>
<div class="container-fluid text-center">
<h4 style="font-family:sans-serif; color: #000; size: 60px; font-weight: bold">Registration form</h4></div>
</div>
<form name="teachersignup" class="form-horizontal" action="teacherLogin.jsp" method="POST">
<div class="form-group">
<label class="control-label col-md-4" style="color:#000; font-size:15px" >User Name: </label>
<div class="col-md-4">
<input type="text" class="form-control" id="tusername" /> <span class="error" id="uname"></span>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-4" style="color:#000; font-size:15px" >Teacher's Name: </label>
<div class="col-md-4">
<input type="text" class="form-control" id="tname" /> <span class="error" id="name" ></span>
</div>
</div>
<div class="form-group">
<label for="email" class="control-label col-md-4" style="color:#000; font-size:15px" >Email: </label>
<div class="col-md-4">
<input type="email" class="form-control" id="temail" /> <span class="error" id="email"></span>
</div>
</div>
<div class="form-group">
<label for="pswd" class="control-label col-md-4" style="color:#000; font-size:15px" >Password: </label>
<div class="col-md-4">
<input type="password" class="form-control" id="tpassword" /> <span class="error" id="password"></span>
</div>
</div>
<div class="form-group">
<label for="iname" class="control-label col-md-4" style="color:#000; font-size:15px" >Institute's Name: </label>
<div class="col-md-4">
<input type="text" class="form-control" id="tiname" /> <span class="error" id="iname"></span>
</div>
</div>
<div class="col-md-12 text-center">
<button type="submit" class="btn btn-success" onsubmit="teacherValidateForm();">Submit</button>
</div>
</form>
</div>
</body>
&#13;
答案 0 :(得分:0)
你有几个错误。首先,您必须从html标记中的函数返回值: 的 强>
答案 1 :(得分:0)
首先使用<form name="teachersignup" class="form-horizontal" action="teacherLogin.jsp" method="POST" onsubmit="return teacherValidateForm();>
然后你可以尝试以下功能。假设所有正则表达式都正确,下面的函数应该可以正常工作。
function teacherValidateForm()
{
var tuid=document.getElementById("tusername");
var tnme=document.getElementById("tname");
var tmail=document.getElementById("temail");
var tpsd=document.getElementById("tpssswod");
var tiname=document.getElementById("tiname");
if(!tuid.match(/^[[A-Za-z][A-Za-z0-9/._]*]{5,}$/) || tuid.value=="")
{
var message= "Username must start with a letter and must be of minimum 5 letters and '_' and '.' is allowed";
document.getElementById(uname).innerHTML=message;
return false;
}
if(!tnme.match(/^[A-Za-z]*\s{1}[A-Za-z]*$/) || tnme.value=="")
{
var message="Teacher's name muct not contain special characters and numbers";
document.getElementById(name).innerHTML=message;
return false;
}
if(!tmail.match(/^[A-Za-z\._\-0-9]*[@][A-Za-z]*[\.][a-z]{2,4}*$/) || tmail.value=="")
{
var message="Enter a valid email";
document.getElementById(email).innerHTML=message;
return false;
}
if(!tpsd.match(/^(?=.*[A-Za-z])(?=.*\d)(?=.*[$@$!%*#?&])[A-Za-z\d$@$!%*#?&]{8,}$/) || tpsd.value=="")
{
var message="Password must contain special cahacters, one catital letter atleast and must be mininum 8 letters";
document.getElementById(password).innerHTML=message;
return false;
}
if(!tiname.match(/^[A-Za-z]*\s{1}[A-Za-z]*$/) || tnme.value=="")
{
var message="Institute's name muct not contain special characters and numbers";
document.getElementById(iname).innerHTML=message;
return false;
}
return true;
}
答案 2 :(得分:0)
你做错了。
var tuid=document.getElementById("tusername");
var tnme=document.getElementById("tname");
var tmail=document.getElementById("temail");
var tpsd=document.getElementById("tpssswod");
var tiname=document.getElementById("tiname");
实际上,您正在使用HTML输入元素分配这些变量,但您需要这些值。所以在这些代码中进行了一些更改
var tuid=document.getElementById("tusername").value;
var tnme=document.getElementById("tname").value;
var tmail=document.getElementById("temail").value;
var tpsd=document.getElementById("tpssswod").value;
var tiname=document.getElementById("tiname").value;