您的位置：首页 → 网页设计 → ASP实例 → 用ASP动态生成JavaScript的表单验证代码

用ASP动态生成JavaScript的表单验证代码

时间：2004/11/7 3:02:00来源：本站整理作者：蓝点我要评论(0)

表单的验证是开发WEB应用程序中常遇到的一关。有时候我们必须保证表单的某些项必须填写、必须为数字、必须是指定的位数等等，这时候就要用到表单验证了，一般我们常用的表单验证有２种方式：

１、编写JavaScript或VBScript的表单验证函数，在客户端进行验证；

２、在表单提交后，使用ASP的方法Request.Form获取表单的输入值进行判断，然后返回结果，这是在服务端进行验证；



　　这２种方式都有其优缺点，比如第１种方式速度比较快，而且通常使用警告框的方式，用户能够很快的根据提示完成表单的填写，但是缺点就是用户的浏览器必须是支持JavaScript脚本的，再不然如果他关闭了JavaScript，那就!@#$%&^*（小田已经倒在地上了^_^）；而第２种方式的兼容性比较好，但是缺点是速度比较慢（提交到服务端，在返回）而且使用也不方便。这次主要是用JavaScript的方法来验证，当然，如果同时用２种方式来验证是最保险了，不过（汗…………）要累死我们这些程序员了：）



　　上面解释了表单验证的２中方式，下面就具体来讲讲动态生成JavaScript的概念。为什么要动态生成呢？因为这种客户端的验证代码是很烦琐的，如果每次都要自己编写真是累啊！用惯DW(Dreamweaver)或UD的朋友可能通常使用表单验证的插件，使用后生成的代码也没有艺术感，而且很多是用不到的（代码冗余）。小田要讲的是，生成完全符合表单情况的代码。



声明：小田对JavaScript并不精通，这里只是想谈谈动态生成的方法，JS的高手完全可以自己改。



　　那么我们开始喽。



１、我们先来看看一段简单的JavaScript的验证代码：

这段代码是验证表单form1的name表单项，必须填写内容。这里就有几个关键的部分：表单域名称、表单项名称、判断语句；这些就是我们下面编写ASP函数的关键了。



２、如何生成JavaScript代码。最简单的，就是用Response.Write输出了，比如把上面代码输出就可以是：



<%

Response.Write ""&vbCrlf&_

%>



这里的vbCrlf是一个回车换行，&是连接符，&_是代码换行连接的字符。



３、这段代码的头和尾是基本固定不变的，变化的是中间的if判断部分，我们可以先把这部分写成函数，小田已经写好一个了，大家可以参考一下，下面是代码：



Function findJS(frmName,errStr)

Dim tmpArr

Dim i

'参数值

i=0

'获取错误列表，建立数组

tmpArr=Split(errStr,"|")

'输出查询条件

Select Case tmpArr(i+1)

Case "0" '必填的Text类型

findJS="if ((document."&frmName&"."&tmpArr(i)&".value)=="""")"&vbCrlf&_

"{"&vbCrlf&_

"window.alert ('"&tmpArr(i+2)&"');"&vbCrlf&_

"document."&frmName&"."&tmpArr(i)&".select();"&vbCrlf&_

"document."&frmName&"."&tmpArr(i)&".focus();"&vbCrlf&_

"return false;"&vbCrlf&_

"}"&vbCrlf

'"else"&vbCrlf&_

'"return true;"&vbCrlf

Exit Function

Case "1" '必填的ListMenu类型

findJS="if ((document."&frmName&"."&tmpArr(i)&".value)=="""")"&vbCrlf&_

"{"&vbCrlf&_

"window.alert ('"&tmpArr(i+2)&"');"&vbCrlf&_

"document."&frmName&"."&tmpArr(i)&".focus();"&vbCrlf&_

"return false;"&vbCrlf&_

"}"&vbCrlf

'"else"&vbCrlf&_

'"return true;"&vbCrlf

Exit Function

Case "2" '必须为数字的Text类型

findJS="if (isNaN(document."&frmName&"."&tmpArr(i)&".value))"&vbCrlf&_

"{"&vbCrlf&_

"window.alert ('"&tmpArr(i+2)&"');"&vbCrlf&_

"document."&frmName&"."&tmpArr(i)&".select();"&vbCrlf&_

"document."&frmName&"."&tmpArr(i)&".focus();"&vbCrlf&_

"return false;"&vbCrlf&_

"}"&vbCrlf

'"else"&vbCrlf&_

'"return true;"&vbCrlf

Exit Function

Case "3" '必须为指定位数的Text类型

findJS="if (document."&frmName&"."&tmpArr(i)&".value.length="&tmpArr(i+3)&")"&vbCrlf&_

"{"&vbCrlf&_

"window.alert ('"&tmpArr(i+2)&"');"&vbCrlf&_

"document."&frmName&"."&tmpArr(i)&".select();"&vbCrlf&_

"document."&frmName&"."&tmpArr(i)&".focus();"&vbCrlf&_

"return false;"&vbCrlf&_

"}"&vbCrlf

'"else"&vbCrlf&_

'"return true;"&vbCrlf

Exit Function

Case "4" '必须大于指定位数的Text类型

findJS="if (document."&frmName&"."&tmpArr(i)&".value.length<"&tmpArr(i+3)&")"&vbCrlf&_

"{"&vbCrlf&_

"window.alert ('"&tmpArr(i+2)&"');"&vbCrlf&_

"document."&frmName&"."&tmpArr(i)&".select();"&vbCrlf&_

"document."&frmName&"."&tmpArr(i)&".focus();"&vbCrlf&_

"return false;"&vbCrlf&_

"}"&vbCrlf

'"else"&vbCrlf&_

'"return true;"&vbCrlf

Exit Function

Case "5" '必须为Email的Text类型

findJS="if ((!emailReg.test(document."&frmName&"."&tmpArr(i)&".value))&&(document."&frmName&"."&tmpArr(i)&".value!=''))"&vbCrlf&_

"{"&vbCrlf&_

"window.alert ('"&tmpArr(i+2)&"');"&vbCrlf&_

"document."&frmName&"."&tmpArr(i)&".select();"&vbCrlf&_

"document."&frmName&"."&tmpArr(i)&".focus();"&vbCrlf&_

"return false;"&vbCrlf&_

"}"&vbCrlf

'"else"&vbCrlf&_

'"return true;"&vbCrlf

Exit Function

Case "6" '必须为a-z或0-9的字符的Text类型

findJS="if ((!pwdReg.test(document."&frmName&"."&tmpArr(i)&".value))&&(document."&frmName&"."&tmpArr(i)&".value!=''))"&vbCrlf&_

"{"&vbCrlf&_

"window.alert ('"&tmpArr(i+2)&"');"&vbCrlf&_

"document."&frmName&"."&tmpArr(i)&".select();"&vbCrlf&_

"document."&frmName&"."&tmpArr(i)&".focus();"&vbCrlf&_

"return false;"&vbCrlf&_

"}"&vbCrlf

'"else"&vbCrlf&_

'"return true;"&vbCrlf

Exit Function

Case "7" '确认密码和密码必须相等的Text类型

findJS="if ((document."&frmName&"."&tmpArr(i)&".value)!=(document."&frmName&"."&tmpArr(i+3)&".value))"&vbCrlf&_

"{"&vbCrlf&_

"window.alert ('"&tmpArr(i+2)&"');"&vbCrlf&_

"document."&frmName&"."&tmpArr(i)&".select();"&vbCrlf&_

"document."&frmName&"."&tmpArr(i)&".focus();"&vbCrlf&_

"return false;"&vbCrlf&_

"}"&vbCrlf

'"else"&vbCrlf&_

'"return true;"&vbCrlf

Exit Function

End Select

End Function





其中参数frmName是指表单域的名称，而errStr是表单项＋判断类型＋出错提示的一个数组，其语法为：



"表单项名称1|判断类型1|出错提示1|[可选参数1],表单项名称2|判断类型2|出错提示2|[可选参数2],..."

表单项名称：例如name等，是自定义的

判断类型：就是Case语句里的0,1,2,3等等

出错提示：例如 姓名必须填写 等，是自定义的

可选参数：比如在判断确认密码和密码必须相等的Text类型时，可选参数就是想要判断相当的密码表单项名称；在必须为指定位数的Text类型时，可选参数就是指定的位数。当然可以选参数可以是好几个，具体就看你Case语句里的if是怎么编的了。



这里已经罗列了８种不同的情况的if判断语句，大家可以继续添加上去，注意这里的几个特别的部分，比如序号５email格式的判断（emailReg.test），这里用到了正则表达式，而正则表达式的定义，我们可以统一放在if判断的外面。



４、函数CheckForm_JS(frmName,errStr)。这个函数的作用是最后将一个个JavaScript的if判断整合起来，代码如下：



Sub CheckForm_JS(frmName,errStr)

Dim tmpArr

Dim i

Dim strShow '输出JS的字符串

'获取错误列表，建立数组

tmpArr=Split(errStr,",")

'写JS

for i=0 to UBound(tmpArr)

if i<>0 then

strShow=strShow&"else "&findJS(frmName,tmpArr(i))

else

strShow=strShow&findJS(frmName,tmpArr(i))

end if

next

'输出

strShow=""

Response.Write strShow

End Sub



大家注意到这里的一段：



if i<>0 then

strShow=strShow&"else "&findJS(frmName,tmpArr(i))

else

strShow=strShow&findJS(frmName,tmpArr(i))

end if



作用是把第1个以后JavaScript的if语句写成else if，而



"var emailReg = /^[_a-z0-9]+@([_a-z0-9]+\.)+[a-z0-9]{2,3}$/;"&vbCrlf&_

"var pwdReg = /[a-z0-9]$/;"&vbCrlf&_



段代码就是正则表达式的定义了，大家可以根据需要扩充。



５、使用方法。我们可以把这２段函数写在一个文件里，比如CheckForm_JS.asp，然后在要使用的页调用，比如：





<%

Call checkform_js("frm","name|0|姓名必须填写,number|2|编号必须是数字,number|3|编号指定为６位数|6,email|5|email的格式不正确")

%>

姓名：

编号：

email：

在实际的使用中，errStr可能会是很长的字符串，书写中我们可以用一断行的方法写，比如上面的errStr我们可以这样写：



<%

Dim errStr

errStr="name|0|姓名必须填写,"&_

　　　"number|2|编号必须是数字,number|3|编号指定为６位数|6,"&_

　　　"email|5|email的格式不正确"

Call checkform_js("frm",errStr)

%>



注意：由于函数中数组的分隔符是"|"和","，所以，errStr中的错误提示不能使用这２个字符，大家可以用全角的来代替。



６、代码运行情况。以上代码运行后，就可以得到下面的JavaScript：







　　熟悉JS的朋友可以自己扩充这个函数，相信可以满足大家的验证要求了。



函数打包下载：http://www.10fber.com/mylesson/asp2js/checkform_js.zip

相关阅读 Windows错误代码大全 Windows错误代码查询激活windows有什么用Mac QQ和Windows QQ聊天记录怎么合并 Mac QQ和Windows QQ聊天记录Windows 10自动更新怎么关闭 如何关闭Windows 10自动更新windows 10 rs4快速预览版17017下载错误问题Win10秋季创意者更新16291更新了什么 win10 16291更新内容windows10秋季创意者更新时间 windows10秋季创意者更新内容kb3150513补丁更新了什么 Windows 10补丁kb3150513是什么

文章评论

查看所有0条评论>>

发表评论

我来说两句...

提交评论