关于form表单验证未通过却提交的有关问题

关于form表单验证未通过却提交的问题

HTML code

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><script language="JavaScript" type="text/javascript"> function chk_reg_input(form) {    if(form.userName.value==""){    alert("请输入用户名");    form.username.focus();    return false;}     if(form.password.value==""){    alert("请输入密码");    form.password.focus();    return false;}        if(form.password_confirm.value==""){    alert("请输入密码");    form.password_conform.focus();    return false;}    if(form.password_confirm.value != form.password.value){    alert("两次密码不一致");    form.password.focus();    return false;}            if(form.email.value==""){    alert("请输入邮箱");    form.email.focus();        return false;}        if(form.user_title.value==""){    alert("请输入职务");    form.user_title.focus();    return false;    }    if(form.department.value==""){    alert("请输入单位");    form.department.focus();        return false;}         if(form.tel_num.value==""){    alert("请输入电话");    form.tel_num.focus();        return false;}        if(form.message.value==""){    alert("请输入备注信息");    form.message.focus();        return false;}                return  true; } </script><style type="text/css"> td { border-right: 1px solid #C1DAD7; border-bottom: 1px dashed #C1DAD7; padding: 7px 6px 6px 6px; color: #4f6b72; } </style><link href="main.css" rel="stylesheet" type="text/css" />        <div id="register" style=" align:center;text-align:center;margin-top:80px;margin-left:150px;background-image:url(../images/registerbg3.png);width:492px;height:500px;">             <form action ="register2.php" method="post" name="register" onsubmit="return chk_reg_input(this.form)">                <table style="margin:auto">                    <tr>                            <td style="width:2px ;color:#FF0000;text-align:right">*</td><td style="text-align:left">用户名:</td>                        <td><input type="text" name="userName" size="20"/> </td>                    </tr>                    <tr>                            <td style="width:2px ;color:#FF0000;text-align:right">*</td><td style="text-align:left">密码:</td>                        <td><input type="password" name="password" size="20"/> </td>                    </tr>                        <tr>                            <td style="width:2px ;color:#FF0000;text-align:right">*</td><td style="text-align:left">确认密码:</td>                        <td><input type="password" name="password_confirm" size="20"/> </td>                    </tr>                                        <tr>                                    <td style="width:2px ;color:#FF0000;text-align:right">*</td><td style="text-align:left">Email:</td>                        <td><input type="text" name="email" size="20"/></td>                    </tr>                    <tr>                            <td style="width:2px;color:#FF0000;text-align:right">*</td><td style="text-align:left">单位名称:</td>                        <td><input type="text" name="department" size="20"/></td>                    </tr>                    <tr>                                <td style="width:2px ;color:#FF0000;text-align:right">*</td><td style="text-align:left">职务:</td>                        <td><input type="text" name="user_title" size="20"/></td>                    </tr>                    <tr>                                <td style="width:2px ;color:#FF0000;text-align:right">*</td><td style="text-align:left">电话:</td>                        <td><input type="text" name="tel_num" size="20"/></td>                    </tr>                    <tr>                        <td style="width:2px ;color:#FF0000;text-align:right">*</td><td style="text-align:left">备注:</td>                        <td><textarea name="message" rows="5"></textarea></td>                    </tr>                    <tr align="center"><td colspan="2" ><input type="image" name="submit" src="../images/register-icon.png" onClick="document.register.submit()"></td>                    </tr>                </table>                </form>        </div>     
 

form表单的register2.php里面就写了:
<?php 
echo '<script type="text/javascript"> alert("恭喜您注册成功，您的账号需要管理员审核后才可以使用，目前还不能进行预约"); location.href="index.php"; </script>';

?>
但是现在的问题是，我的表单没有写完，比如没有填写电话，那么我点击提交按钮后，出现的情况是：首先弹出“请输入电话”，然后接着就弹出了register2.php文件里的"恭喜您注册成功，您的账号需要管理员审核后才可以使用，目前还不能进行预约" 这个提示框。所以这个问题就是说验证不成功却提交了表单，执行了register2.php文件。请问该怎么办呢？

[解决办法]

HTML code

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><script language="JavaScript" type="text/javascript"> function chk_reg_input(form) {     if(form.userName.value==""){    alert("请输入用户名");    form.userName.focus();    //1 处，userName写错了    return false;}     if(form.password.value==""){    alert("请输入密码");    form.password.focus();    return false;}        if(form.password_confirm.value==""){    alert("请输入密码");    form.password_confirm.focus();  //2 处，password_confirm写错了    return false;}    if(form.password_confirm.value != form.password.value){    alert("两次密码不一致");    form.password.focus();    return false;}            if(form.email.value==""){    alert("请输入邮箱");    form.email.focus();        return false;}        if(form.user_title.value==""){    alert("请输入职务");    form.user_title.focus();    return false;    }    if(form.department.value==""){    alert("请输入单位");    form.department.focus();        return false;}         if(form.tel_num.value==""){    alert("请输入电话");    form.tel_num.focus();        return false;}        if(form.message.value==""){    alert("请输入备注信息");    form.message.focus();        return false;}                return  true; } </script><style type="text/css"> td { border-right: 1px solid #C1DAD7; border-bottom: 1px dashed #C1DAD7; padding: 7px 6px 6px 6px; color: #4f6b72; } </style><link href="main.css" rel="stylesheet" type="text/css" />        <div id="register" style=" align:center;text-align:center;margin-top:80px;margin-left:150px;background-image:url(../images/registerbg3.png);width:492px;height:500px;">             <form action ="register2.php" method="post" name="register" onsubmit="return chk_reg_input(this)">  <!--   //3处，传递this即可 -->                <table style="margin:auto">                    <tr>                            <td style="width:2px ;color:#FF0000;text-align:right">*</td><td style="text-align:left">用户名:</td>                        <td><input type="text" name="userName" size="20"/> </td>                    </tr>                    <tr>                            <td style="width:2px ;color:#FF0000;text-align:right">*</td><td style="text-align:left">密码:</td>                        <td><input type="password" name="password" size="20"/> </td>                    </tr>                        <tr>                            <td style="width:2px ;color:#FF0000;text-align:right">*</td><td style="text-align:left">确认密码:</td>                        <td><input type="password" name="password_confirm" size="20"/> </td>                    </tr>                                        <tr>                                    <td style="width:2px ;color:#FF0000;text-align:right">*</td><td style="text-align:left">Email:</td>                        <td><input type="text" name="email" size="20"/></td>                    </tr>                    <tr>                            <td style="width:2px;color:#FF0000;text-align:right">*</td><td style="text-align:left">单位名称:</td>                        <td><input type="text" name="department" size="20"/></td>                    </tr>                    <tr>                                <td style="width:2px ;color:#FF0000;text-align:right">*</td><td style="text-align:left">职务:</td>                        <td><input type="text" name="user_title" size="20"/></td>                    </tr>                    <tr>                                <td style="width:2px ;color:#FF0000;text-align:right">*</td><td style="text-align:left">电话:</td>                        <td><input type="text" name="tel_num" size="20"/></td>                    </tr>                    <tr>                        <td style="width:2px ;color:#FF0000;text-align:right">*</td><td style="text-align:left">备注:</td>                        <td><textarea name="message" rows="5"></textarea></td>                    </tr>                    <tr align="center"><td colspan="2" ><input type="image" name="submit" src='../images/register-icon.png' ></td>   <!-- //4处，image能提交表单。去掉onclick事件。-->                    </tr>                </table>                </form>        </div> 
  

 

查看更多 下一篇