当前页面: 开发资料首页 → Javascript 专题 → Javascript实例教程(9) 检验表单有效性

Javascript实例教程(9) 检验表单有效性

摘要: Javascript实例教程(9) 检验表单有效性

表单的有效性检验是JavaScript一个很有用的方面。它可以用于检查一个给定的表单以及发现表单中的任何问题，比如一个空白的输入框或者一个无效的E-mail（电子邮件）地址，然后它可以通知用户并且就不会将这些错误的表单传给服务器以节省时间。另外，除此以外，对表单标签的一些修改跟其它类型的脚本是类似的。以下的例子是一个简单的表单，如下面表单所示。你可以让名字的方框留空白或者输入一个电子邮件地址而没有@符号，即是输入错误的内容，看看JavaScript是进行表单的有效性检验的。
<script language=JavaScript>function formCheck() { if (document.theform.user_name.value == ) { alert(Please put in a name.); return false; } if (document.theform.email.value.indexOf(@)==-1 || document.theform.email.value==) { alert(Please include a proper email address.); return false; }}</script> <form name=theform method=post action=mailto: onSubmit=return formCheck();> <table width=300 border=0 cellspacing=0 cellpadding=0 align=center> <tr> <td colspan=2></td> </tr> <tr> <td width=95>姓名：</td> <td width=205> <input type=text name=user_name> </td> </tr> <tr> <td width=95>电子邮箱：</td> <td width=205> <input type=text name=email> </td> </tr> <tr> <td colspan=2> <input type=submit name=Submit value=Submit> </td> </tr> </table> </form>
　　结果你可以发现如果你忘记输入某一特定类型的数据到表单中去，它就会警告你并且取消提交给服务器。直到你键入了正确的信息，它才将表单发送给服务器。

　　下面我们来好好研究一下在Javascript中是如何进行表单的有效性检验的。其中在表单有效性检验中最重要的代码是在表单标签处的一个时间处理器，这个时间处理器（onSubmit）必须返回真值的时候才提交表单。以下是详细的表单代码：

<form NAME = theform

ACTION = mailto:

METHOD = POST

ENCTYPE = multipart/form-data

onSubmit=return formCheck()>

当Submit（提交）按钮被按下的时候，这个时间处理器就被触发，它接着执行函数formCheck()，这个函数是用于检查表单中是否没有错误了。

↑返回目录
前一篇: Javascript实例教程(10) 随机显示图片
后一篇: Javascript实例教程(8) 利用Javascript基于浏览器类型