Validform

 

javascript部分：

<script src="../js/jquery-1.8.0.min.js"></script>
<script src="../js/Validform_v5.3.2_min.js"></script>

<script type="text/javascript">
$(document).ready(function () {
$("#form1").initValidform();
})
//初始化验证表单
$.fn.initValidform = function () {
var checkValidform = function (formObj) {
$(formObj).Validform({
tiptype: function (msg, o, cssctl) {
/*msg：提示信息;
o:{obj:*,type:*,curform:*}
obj指向的是当前验证的表单元素（或表单对象）；
type指示提示的状态，值为1、2、3、4， 1：正在检测/提交数据，2：通过验证，3：验证失败，4：提示ignore状态；
curform为当前form对象;
cssctl:内置的提示信息样式控制函数，该函数需传入两个参数：显示提示信息的对象 和 当前提示的状态（既形参o中的type）；*/
//全部验证通过提交表单时o.obj为该表单对象;
if (!o.obj.is("form")) {
//定位到相应的Tab页面
if (o.obj.is(o.curform.find(".Validform_error:first"))) {
var tabobj = o.obj.parents(".tab-content"); //显示当前的选项
var tabindex = $(".tab-content").index(tabobj); //显示当前选项索引
if (!$(".content-tab ul li").eq(tabindex).children("a").hasClass("selected")) {
$(".content-tab ul li a").removeClass("selected");
$(".content-tab ul li").eq(tabindex).children("a").addClass("selected");
$(".tab-content").hide();
tabobj.show();
}
}
//页面上不存在提示信息的标签时，自动创建;
if (o.obj.parents("dd").find(".Validform_checktip").length == 0) {
o.obj.parents("dd").append("<span class='Validform_checktip' />");
o.obj.parents("dd").next().find(".Validform_checktip").remove();
}
var objtip = o.obj.parents("dd").find(".Validform_checktip");
cssctl(objtip, o.type);
objtip.text(msg);
}
},
showAllError: true
});
};
return $(this).each(function () {
checkValidform($(this));
});
}
</script>

 

html 内容部分：

<form id="form1">
<input type="text" datatype="*2-10" errormsg="请填写2-10个字符！" />
</form>