html表单验证性别,表单验证

HC-MUI集成了自主研发的、高效、简洁的表单验证。涵盖了：字符串、数值、字符串长度、邮件地址、网络地址、手机号码、邮编、自定义函数、自定义正则表达式等丰富的验证接口。

步骤如下：

1、表单内元素设置

对表单元素进行体检验证您需要对对应的元素进行以下属性设置

2、提交时的检查函数绑定

普通表单提交：

//表单内元素......

如果您需要使用ajax提交：

$('#button').click(function(){

//获取验证结果(验证通过返回真/否则返回假)

var res = $('#form1').HCMUI_FormCheck()

if(res){

//此处编写ajax提交代码即可......

}

});

3、验证方式与方法

3.1 string

功能描述 : 字符串长度验证

参数格式 : checkData="x," 或 checkData="x,x"

3.2 int

功能描述 : 整数及整数位数验证

参数格式 : checkData="x," 或 checkData="x,x"

3.3between

功能描述 : 2数之间验证(不限制数值类型)

参数格式 : checkData="x," checkData=",x" 或 checkData="x,x"

3.3 betweenD

功能描述 : 2数之间验证(数值类型为整数)

参数格式 : checkData="x," checkData=",x" 或 checkData="x,x"

3.4 betweenF

功能描述 : 2数之间验证(数值类型为小数)

参数格式 : checkData="x," checkData=",x" 或 checkData="x,x"

3.5 same

功能描述 : 是否为某个固定值

参数格式 : checkData="xx"

3.6 sameWith

功能描述 : 是否和指定id的表单元素的值相等

参数格式 : checkData="元素id"

3.7 notSame

功能描述 : 不等某个固定值

参数格式 : checkData="xx"

3.8 notSameWith

功能描述 : 是否和指定id表单元素的值不相等

参数格式 : checkData="元素id"

3.9 email

功能描述 : 电子邮箱验证

参数格式 : 无需参数

phone

功能描述 : 手机号码验证

参数格式 : 无需参数

3.10 url

功能描述 : 验证字符串是否为网址

参数格式 : 无需参数

3.11 zipCode

功能描述 : 国内邮编验证

参数格式 : 无需参数

3.12 reg

功能描述 : 正则表达式验证

参数格式 : checkData="正则表达式内容"

3.13 fun

功能描述 : 通过调用自定义函数进行验证 自动传递值到改函数。例: func(val); 自定义函数的返回值必须为布尔类型(验证成功返回真，否则返回假)。

参数格式 : checkData="函数名称"

3.14 附件验证

有很多特殊的表单元素例如 checkBox(多选框), radio(单选框) 等元素您可能无法使用 checkType="" checkData="" 这样的属性标示进行验证， 那么快了定义HCMUI_AttachFormCheck()函数吧。

HCMUI_AttachFormCheck() 函数会被自动调用，在这个函数里面您可以编写自己的验证逻辑(复杂也罢简单也好)，验证后请根据验证结果返回真假并完成错误信息的提示工作。

自定义错误信息展示函数

HCMUI_FormCheck默认采用alert函数进行错误提示，并将错误信息内容保存至全局变量 hcFormCheckErrorMsg，将对应的表单元素对象保存至全局变量 HCMUI_FormCheckErrorMsg。

系统会自动检测函数 HCMUI_FormCheckErrorShow() 是否被定义，如果 HCMUI_FormCheckErrorShow() 被开发者定义系统将调用该函数进行错误提示！

利用2个全局变量 HCMUI_FormCheckErrorMsg、 HCMUI_FormCheckErrorObj 以及函数 HCMUI_FormCheckErrorShow()的定义您可以灵活的打造出适合对应项目的错误提醒。

样机完整代码

//自定义错误信息展示函数

function HCMUI_FormCheckErrorShow(msg){HCMUI_Alert('错误提示', msg);}

//附加检查函数

function HCMUI_AttachFormCheck(){

var radioSize = $(':radio:checked').size();

if(radioSize 

HCMUI_Alert('错误提示', '请选择性别');

return false;

}

return true;

}