Web表单提交客户端数据验证函数库的建立
deminy 2001/08/19
表单是Internet世界最常见的Web技术应用之一。表单的提交势必需要有一项基础工作——表单数据校验——要做,以确认表单所附带的数据信息的有效性。目前的Web世界中很少有统一的规范性的表单提交验证函数库。在开发中,经过长期的实践,我建立了这么一套表单数据校验函数库。在我们的应用程序开发Team中目前已经部署了这套函数库。实践表明,该套函数库的应用对于简化Web表单数据校验的效率提高和准确起到了很好的作用。特此共享。
说明:
1.该函数库由本人积累以往开发经验建立,转载/刊登请注明出处。也许网上还有其它的Web数据校验函数库,这里提出的仅仅是我的一些思路和想法。本文也没有力图应用特别的、复杂的技术来描述数据校验,更多的是在实现该功能的思路上做了尽可能的完善。
2.在本函数库中,所追求的只是防止用户不正当的数据输入并对此给以相应的向导性指导。对于刻意的、恶意的用户信息提交,并不能够仅靠程序员开发的代码来完全解决。
关于该函数库(check_form_std.js)的函数具体说明:
/*
written by deminy on 2001/07/26
last modified by deminy on 2001/08/07
function is_only_space(str);
该函数将判断某一变量是否为空字符串
该函数将被函数is_textbox_null调用
str:被测试的字符串变量
function is_item_not_null(Item, ItemCaption);
该函数将判断表单中元素值是否为空
该函数将调用is_only_space
Item: 表单元素名称
ItemCaption: Item的说明
function check_multiple_item (objForm , Item , ItemCaption, AllowNum);
该函数用于检验某些多选表单元素
objForm: 表单名称
Item: 将被检验的多选表单元素名称
ItemCaption: Item的说明
AllowNum: Item允许被选择的元素个数
function is_digital(Item, ItemCaption)
该函数用于检验某一Item是否为数字
Item: 表单中元素名称,或者变量名
isObj:确定变量Email代表一个Item对象还是一个仅仅变量,if true,Item是一个表单中元素名称,否则……
ItemCaption:Item的说明
function check_length(Item, MinLength, MaxLength, ItemCaption)
该函数用于检验某一Item是否长度符合要求
Item: 表单中元素名称,或者变量名
MinLength:最短长度
MaxLength:最大长度
ItemCaption:Item的说明
function backup1(objForm)
备用函数:可以限定表单元素的取值范围和长度
##############################################################################
##############################################################################
##############################################################################
以下函数直接用于表单验证
function check_email(Email)
该函数用于检验Email
Email: 表单中Email元素名称,或者Email变量名
function check_postcode(PostCode)
该函数用于检验邮政编码
function check_password(Pass1, Pass2, MinLength, MaxLength)
该函数用于检验密码
function check_idcard(IDCard)
该函数用于检验身份证
function check_text(Item, MinLength, MaxLength, ItemCaption)
该函数用于检验文本框
function check_radio(Item, ItemCaption)
该函数用于检验Radio框
Item:表单元素名,比如 objForm.username
ItemCaption:表单元素显示给用户看的文字名,比如 "用户名"
当Item元素不存在或者尚未选择相应选项的时候,将报出错提醒信息给用户。
##############################################################################
##############################################################################
##############################################################################
*/
function is_only_space(str){
for(i=0;i<=str.length-1;i++){
if (str.charAt(i) != " ")
return false;
}
return true;
}
function check_multiple_item (objForm , Item , ItemCaption, AllowNum)
{
selected_num = 0;
is_selected = false;
if (isNaN(AllowNum))
AllowNum = 1;
for (i=0;i<objForm.elements.length;i++)
{
if (objForm.elements[i].name == Item)
{
if (objForm.elements[i].options[0].selected)
{
alert(ItemCaption + "不能选择\“请选择\”");
objForm.elements[i].focus();
return false;
}
for (j=0;j<objForm.elements[i].length;j++)
{
if (objForm.elements[i].options[j].selected)
{
selected_num++;
is_selected = true;
}
}
if (selected_num > AllowNum)
{
alert(ItemCaption + "选择的数目过多");
objForm.elements[i].focus();
return false;
}
if (!is_selected)
{
alert(ItemCaption + "不能为空");
objForm.elements[i].focus();
return false;
}
else
return true;
}
}
alert("Err, I can’t find the item " + Item + ", you can kick me");
return false;
}
function is_item_not_null(Item, ItemCaption)
{
if ((Item.value == "") || is_only_space(Item.value))
{
alert(ItemCaption + "不能为空!");
Item.focus();
return false;
}
return true;
}
function check_email(Email)
{
if (!is_item_not_null(Email, "Email地址"))
return false;
var pattern = /^([.a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-])+/;
flag = pattern.test(Email.value);
if(!flag)
{
alert("您的Email地址填写不对。");
Email.focus();
return false;
}
else
return true;
}
function is_digital(Item, ItemCaption)
{
var pattern = /^([0-9])+$/;
flag = pattern.test(Item.value);
if(!flag)
{
alert(ItemCaption + "不是数字。");
Item.focus();
return false;
}
else
return true;
}
function check_length(Item, MinLength, MaxLength, ItemCaption)
{
if ((MinLength == 0) && (MaxLength == 0))
return true;
if (MaxLength < MinLength)
{
alert("\"check_length\"函数调用错误。");
return false;
}
if ((Item.value.length < MinLength) || (Item.value.length > MaxLength))
{
alert(ItemCaption + "长度不符合要求。");
Item.focus();
return false;
}
else
return true;
}
function backup1(objForm)
{
var pattern = /^[a-zA-Z][a-zA-Z0-9_-]{4,9}$/;
flag = pattern.test(objForm.text1.value);
if(!flag){
alert("文本不对!");
objForm.text1.focus();
return false;
}
}
function check_postcode(PostCode)
{
if (!check_length(PostCode, 6, 6, "邮政编码"))
return false;
if (!is_digital(PostCode, "邮政编码"))
return false;
return true;
}
function check_password(Pass1, Pass2, MinLength, MaxLength)
{
if (!check_text(Pass1, MinLength, MaxLength, "密码"))
return false;
if (!check_text(Pass2, MinLength, MaxLength, "第二次输入的密码"))
return false;
if (Pass1.value != Pass2.value)
{
alert("两次输入的密码不一致。");
Pass1.value = "";
Pass2.value = "";
Pass1.focus();
return false;
}
return true;
}
function check_idcard(IDCard)
{
if (!is_item_not_null(IDCard, "身份证号码"))
return false;
if (!is_digital(IDCard, "身份证号码"))
return false;
if ((IDCard.value.length != 15) && (IDCard.value.length != 18))
{
alert("身份证号码长度不对。");
IDCard.focus();
return false;
}
return true;
}
function check_text(Item, MinLength, MaxLength, ItemCaption)
{
if (!is_item_not_null(Item, ItemCaption))
return false;
if (!check_length(Item, MinLength, MaxLength, ItemCaption))
return false;
return true;
}
function check_radio(Item, ItemCaption)
{
if (Item)
{
for (i = 0; i < Item.length;i++ )
{
if (Item[i].checked == true)
return true;
}
alert(ItemCaption + "不能为空");
Item[0].focus();
return false;
}
else
{
alert("表单元素\"" + ItemCaption + "\"不存在");
return false;
}
}
关于该函数库的使用实例参见http://www.deminy.net/article/check_form/test.check_form.html。
点击http://www.deminy.net/article/check_form.zip下载该函数库的使用实例。
|