欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

表单提交的验证

程序员文章站 2022-04-18 21:30:14
...

 

一 应用
提交表单时,通过onsubmit事件来判断表单中是否有空文本框,如果有,则不允许提交,并通过表单的onreset事件将表单中的文本框清空,以便重新输入信息。
 
二 代码
<table width="487" height="333" border="0" align="center" cellpadding="0" cellspacing="0" background="bg.JPG">
 <tr>
 <td align="center" valign="top"><br>
 <br>
 <br>
 <br> <br> <table width="86%" border="0" align="center" cellpadding="2" cellspacing="1" bgcolor="#6699CC">
 <form name="form1" onReset="return AllReset()" onsubmit="return AllSubmit()">
 <tr bgcolor="#FFFFFF">
 <td height="22" align="right">所属类别:</td>
 <td height="22" align="left">  
 <select name="txt1" id="txt1">
 <option value="数码设备">数码设备</option>
 <option value="家用电器">家用电器</option>
 <option value="礼品工艺">礼品工艺</option>
 </select>
 <select name="txt2" id="txt2">
 <option value="数码相机">数码相机</option>
 <option value="打印机">打印机</option>
 </select></td>
 </tr>
 <tr bgcolor="#FFFFFF">
 <td height="22" align="right">商品名称:</td>
 <td height="22" align="left"><input name="txt3" type="text" id="txt3" size="30" maxlength="50"></td>
 </tr>
 <tr bgcolor="#FFFFFF">
 <td height="22" align="right">会员价:</td>
 <td height="22" align="left"><input name="txt4" type="text" id="txt4" size="10"></td>
 </tr>
 <tr bgcolor="#FFFFFF">
 <td height="22" align="right">提供厂商:</td>
 <td height="22" align="left"><input name="txt5" type="text" id="txt5" size="30" maxlength="50"></td>
 </tr>
 <tr bgcolor="#FFFFFF">
 <td height="22" align="right">商品简介:</td>
 <td height="22" align="left"><textarea name="txt6" cols="35" rows="4" id="txt6"></textarea></td>
 </tr>
 <tr bgcolor="#FFFFFF">
 <td height="22" align="right">商品数量:</td>
 <td height="22" align="left"><input name="txt7" type="text" id="txt7" size="10"></td>
 </tr>
 <tr bgcolor="#FFFFFF">
 <td height="22" colspan="2" align="center"><input name="sub" type="submit" id="sub2" value="提交">
&nbsp;
 <input type="reset" name="Submit2" value="重 置"></td>
 </tr>
 </form>
 </table></td>
 </tr>
</table>
<script language="javascript">
<!--
function AllReset()
{
 if (window.confirm("是否进行重置?"))  //弹出提示框
 return true;
 else
 return false;
}
function AllSubmit()
{
 var T=true;
 var e=window.event;
 var obj=e.srcElement;
 for (var i=1;i<=7;i++) //按指定名称遍历表单中的控件
 {
 if (eval("obj."+"txt"+i).value=="") //判断当前控件的值是否为空
 {
 T=false;
 break;  //退出本次循环
 }
 }
 if (!T)  //当表单中的控件有空值时
 {
 alert("提交信息不允许为空");
 }
 return T; //返回布尔型值
}
//-->
</script>
 
 
三 运行结果
图7_19.png
  • 表单提交的验证
            
    
    博客分类: JavaScript 表单验证 
  • 大小: 11.9 KB
相关标签: 表单 验证