关键函数
通过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");
?>
|
验证用户注册信息是否合法的运行结果如下图所示。
图验证用户的注册信息是否合法的运行结果
发表回复