关键函数
通过JavaScript对用户注册信息的合法性进行验证时,经常需要对数值型数据进行检验。
JavaScript可以应用isNaN()函数实现上述功能,下面对该函数进行讲解。
isNaN()函数
用于判断该函数的参数是否为数值型数据,是返回False,否则返回True。
语法
bool isNaN(var)
参数var为要进行判断的数据。
功能实现
用户填写完注册信息后,为了保证这些信息的合法性,还应该对这些信息进行验证。对注册信息的合法性进行验证既可以应用PHP代码实现,也可以应用JavaScript实现。开发人员可以根据实际情况进行选取,如果担心客户端浏览器对JavaScript进行了限制,则可以采用PHP代码实现,但使用这种方法对注册信息进行验证是在服务器中进行的,所以会浪费大量的服务器资源。而应用JavaScript脚本对用户的注册信息进行验证,是客户端浏览器实现的,所以会在很大程度上节省服务器资源。本站对用户注册信息的验证通过JavaScript实现。在编写用户注册信息验证模块时,将实现用户注册信息验证的代码封装到自定义函数chkinput login()中,并在表单《form》标记的onSubmit事件中对该函数进行调用,Chkinput login()函数的代码如下。
以下为
以下为<?php
include_once("top.php");
?>
<table width="780" height="370" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="175" valign="top"><table width="175" height="120" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#D2D7DD">
<tr>
<td bgcolor="#F2F3F5" valign="top">
<?php
include_once("left.php");
?>
</td>
<td width="10"> </td>
<td width="595" valign="top"><table width="200" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><img src="www.zw361.com/images/reg.gif" width="590" height="35"></td>
</tr>
</table>
<table width="500" height="10" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td> </td>
</tr>
</table>
<table width="500" height="300" border="0" align="center" cellpadding="0" cellspacing="0">
<script language="javascript">
function chkinput_login(form){ //断用户是否输入了用户名
if(form.usernc.value==""){
alert("请输入用户昵称!"); //如果没输入用户名,则弹出一个提示框提示未输入用户名
form.usernc.focus(); //重新使用户昵称输入框获取焦点
return(false);
}
if(form.userpwd1.value==""){
alert("请输入注册密码!");
form.userpwd1.focus();
return(false);
}
if(form.userpwd2.value==""){
alert("请输入确认密码!");
form.userpwd2.focus();
return(false);
}
if(form.userpwd1.value!=form.userpwd2.value){ //判断密码与确认密码是否相同
alert("注册密码于确认密码不同!");
form.userpwd1.focus();
return(false);
}
if(form.userpwd1.value.length<6){ //判断密码长度是否大于或等于6位
alert("注册密码应大于6位!");
form.userpwd1.focus();
return(false);
}
if(form.truename.value==""){
alert("请输入真实姓名!");
form.truename.focus();
return(false);
}
if(form.sex.value==""){
alert("请选择性别!");
form.sex.focus();
return(false);
}
if(form.email.value==""){
alert("请输入E-mail地址!");
form.email.focus();
return(false);
}
if(form.email.value.match(/^(.+)@(.+)$/)==null){ //判断邮件地址的格式是否正确
alert("请输入正确的E-mail地址!");
form.email.focus();
return(false);
}
if(form.tel.value==""){
alert("请输入联系电话!");
form.tel.focus();
return(false);
}
if(isNaN(form.tel.value)){
//判断用户输入的联系电话是否由数字组成
alert("电话号只能由数字组成!");
form.tel.focus();
return(false);
}
if(form.qq.value==""){
alert("请输入QQ号码!");
form.qq.focus();
return(false);
}
if(isNaN(form.qq.value)){
alert("QQ号号只能由数字组成!");
form.qq.focus();
return(false);
}
if(form.address.value==""){
alert("请输入联系地址!");
form.address.focus();
return(false);
}
return(true); //如果满足上述条件,则返回True值,并提交表单
}
</script>
<script language="javascript">
function open_chknc(x){
window.open("chkusernc.php?nc="+x,"newframe","top=250,left=450,width=150,height=100,menubar=no,toobar=no,location=no,scrollbars=no,resizeable=no");
}
</script>
<form name="form_reg" method="post" action="savereg.php" onSubmit="return chkinput_login(this)">
<tr>
<td width="120" height="30"><div align="center">用户昵称:</div></td>
<td colspan="2"><table width="350" height="25" border="0" align="left" cellpadding="0" cellspacing="0">
<tr>
<td width="187"> <input type="text" name="usernc" size="25" class="inputcss"></td>
<td width="163"><input type="button" name="button_chkusernc" value="是否已用" onClick="open_chknc(form_reg.usernc.value)"></td>
</tr>
</table></td>
</tr>
<tr>
<td height="30"><div align="center">密 码:</div></td>
<td height="30" colspan="2"> <input type="password" name="userpwd1" size="25" class="inputcss"></td>
</tr>
<tr>
<td height="30"><div align="center">确认密码:</div></td>
<td height="30" colspan="2"> <input type="password" name="userpwd2" size="25" class="inputcss"></td>
</tr>
<tr>
<td height="30"><div align="center">真实姓名: </div></td>
<td height="30" colspan="2"> <input type="text" name="truename" size="25" class="inputcss"></td>
</tr>
<tr>
<td height="30"><div align="center">性 别:</div></td>
<td height="30" colspan="2"> <select name="sex">
<option value="">请选择</option>
<option value="男">-男-</option>
<option value="女">-女-</option>
</select> </td>
</tr>
<tr>
<td height="30"><div align="center">E-mail:</div></td>
<td height="30" colspan="2"> <input type="text" name="email" size="25" class="inputcss"></td>
</tr>
<tr>
<td height="30"><div align="center">联系电话:</div></td>
<td height="30" colspan="2"> <input type="text" name="tel" size="25" class="inputcss"></td>
</tr>
<tr>
<td height="30"><div align="center">QQ号码:</div></td>
<td height="30" colspan="2"> <input type="text" name="qq" size="25" class="inputcss"></td>
</tr>
<tr>
<td height="30"><div align="center">头像选择: </div></td>
<td width="92" height="30"> <select name="photo" onchange="form_reg.user_face.src=this.value">
<?php
for($i=0;$i<=11;$i++){
?>
<option value="<?php echo "www.zw361.com/images/face/".$i.".gif"?>"><?php echo $i.".gif"?></option>
<?php
}
?>
</select></td>
<td width="288"> <img id=user_face src="www.zw361.com/images/face/0.gif" width="60" height="60"></td>
</tr>
<tr>
<td height="30"><div align="center">联系地址:www.zw361.com </div></td>
<td height="30" colspan="2"> <input type="text" name="address" size="40" class="inputcss"></td>
</tr>
<tr>
<td height="30" colspan="3"><div align="center"><input type="submit" name="submit" value="注册"> <input type="reset" name="reset" value="重写"></div></td>
</tr>
</form>
</table></td>
</tr>
</table>
<?php
include_once("bottom.php");
?>
|
|