我有一个简单的表单验证脚本:
<script language=”javascript”>
function return validate_form(register)
{
if (""==document.forms.register.FNAME.value){
alert("This field is required!");
document.forms.register.FNAME.focus();
return false;
}
if (""==document.forms.register.LNAME.value){
alert("This field is required!");
document.forms.register.LNAME.focus();
return false;
}
if (EMAIL.value.search( /^[a-zA-Z]+([_\.-]?[a-zA-Z0-9]+)*@[a-zA-Z0-9]+([\.-]?[a-zA-Z0-9]+)*(\.[a-zA-Z]{2,4})+$/ ) == -1){
alert(“Wrong email”);
return false;
}
if('0'==document.forms.register.GENDER.value){
alert("You must select an option!");
document.forms.register.GENDER.focus();
return false;
}
if (""==document.forms.register.ADDRESS.value){
alert("This field is required!");
document.forms.register.ADDRESS.focus();
return false;
}
if (""==document.forms.register.CONTACTNO.value){
alert("This field is required!");
document.forms.register.CONTACTNO.focus();
return false;
}
}
</script>
使用onSubmit处理程序调用该函数,但单击提交时没有任何反应。它直接转到PHP脚本而不是javascript'拦截'它。有什么想法吗?
表单HTML:
<form name="register" action="register.php" method="POST" onsubmit="return validate_form(register);">
<table width="100%" border="0">
<tr>
<td width="46%" height="24" align="right">First Name:</td>
<td width="54%"><input name="FNAME" type="text" size"20" /></td>
</tr>
<tr>
<td height="24" align="right">Last Name:</td>
<td><input name="LNAME" type="text" size"20" /></td>
</tr>
<tr>
<td height="24" align="right">Email Address</td>
<td><input name="EMAIL" type="text" size"20" /></td>
</tr>
<tr>
<td height="24" align="right">Gender:</td>
<td><select name="GENDER">
<option value="" selected="selected">- Select One -</option>
<option value="Male">Male</option>
<option value="Female">Female</option></select></td>
</tr>
<tr>
<td height="24" align="right">Address:</td>
<td><input name="ADDRESS" type="text" size"20" /></td>
</tr>
<tr>
<td height="24" align="right">Contact No.:</td>
<td><input name="CONTACTNO" type="text" size"20" /></td>
</tr>
<tr>
<td height="24" align="right">Password</td>
<td><input name="PASSWORD" type="password" size"20" /></td>
</tr>
<tr>
<td height="24" align="right">Re-type Password</td>
<td><input name="PASSWORD2" type="password" size"20" /></td>
</tr>
<tr>
<td> </td>
<td><input name="submit" type="submit" value="Register" /></td>
</tr>
</table>
</form>
警告信息未显示?有什么不对?
答案 0 :(得分:3)
好吧,我重构了你的代码以使其更具意义和可维护性
html更改:
<form name="register" action="register.php" method="POST" onsubmit="return validate_form();">
示例JS:
function validate_form() {
var frm = document.forms.register;
function focus_and_false(el) {
el.focus();
return false;
}
if( frm.FNAME.value === "" ) { /* repeat this for all form elements you want to validate */
alert("This field is required!");
return focus_and_false(frm.FNAME); /* this is not the best, but i'm showing you how you can reduce overall code by not rewriting the same things. */
}
return true;
}
答案 1 :(得分:1)
您的javascript中有一个巨大的语法错误...
function return validate_form(register)
应该是
function validate_form(register)
也许你可以从那开始:)
在函数启动后添加一个警告,这样你就知道当你调用它时,它实际执行或至少尝试。
另一种语法错误:
<script language=”javascript”>
应该是
<script type="text/javascript">
最后我将函数名改为
function validateForm(register)
让我知道它是否有效:)
答案 2 :(得分:0)
你的代码中有卷曲引号
alert(“Wrong email”); <---bad quotes
您不应该只使用名称
onsubmit="return validate_form(register);"
传入此指向当前范围的表单元素。
onsubmit="return validate_form(this);"
什么是EMAIL?
EMAIL.value
不要只引用元素名称。