推荐一个不错的国产jquery校验插件formvalidator

  在学到jquery-validate时,感觉还是不错的,老外的,但感觉分组校验时不是很好,
于是搜索了下,找到了这个国产的jquery表单校验插件,用了下感觉还是不错的,
所以推荐下,地址是:
http://www.yhuan.com/formvalidator/userguide.html
该作者的blog地址是:http://www.cnblogs.com/wzmaodong/archive/2008/01/11/1034901.html

下面简单讲解下,比如一个常见的情景是,一个页面中,分两部分(两个组),比如一边是
用户注册的表单,一边是用户登陆的表单,则可以认为是两个分组,比如以简单的对某个文本框的校验为例:

密码:<input name="tbxLoginPassword" maxlength="50" id="tbxLoginPassword" type="password">
<div style="display: none;" id="loginPassword"></div>
<div class="onError"><span id="cvlLoginUser" style="color: Red; display: none;">用户名或密码错误</span></div>

使用时:
//加载jQuery类库
<script src="jquery_last.js" type="text/javascript"></script>
//加载插件的样式库,如果你是自动构建提示层,请加载validatorAuto.css
<link type="text/css" rel="stylesheet" href="style/validator.css"></link>
//加载插件
<script src="formValidator.js" type="text/javascript"></script>
//加载扩展库
<script src="formValidatorRegex.js" type="text/javascript"></script>

<script type="text/javascript">
$(
	function()
	{	
		$.formValidator.initConfig(
			{
				autotip: true,
				validatorgroup: "1"
			});
		
		$("#tbxLoginPassword")
			.formValidator(
				{
					validatorgroup: "1",
					tipid: "loginPassword",
					onshow: "",
					onfocus: "",
					oncorrect: ""
				})
			.inputValidator(
				{
					min: 1,
					onerror: "请填写密码"
				});
		$("#tbxLoginVerifier")
			.formValidator(
				{
					validatorgroup: "1",
					tipid: "loginVerifier",
					onshow: "",
					onfocus: "",
					oncorrect: ""
				})
			.inputValidator(
				{
					min: 1,
					onerror: "请填写验证码"
				});
		$.formValidator.initConfig(
			{
				autotip: true,
				validatorgroup: "2"
			});
		$("#tbxRegisterNickname")
			.formValidator(
				{
					validatorgroup: "2",
					tipid: "registerNickname",
					onshow: "4-20位字符,可由中英文、数字及“_”、“-”组成",
					onfocus: "",
					oncorrect: ""
				})
			.inputValidator(
				{
					min: 4,
					max: 20,
					onerror: "用户名长度只能在4-20位字符之间"
				})
			.regexValidator(
				{
					regexp: "username",
					datatype: "enum",
					onerror: "用户名只能由中英文、数字及“_”、“-”组成"
				});
		//if ($("#hflRegisterNickname").val() != "true")
		//{   
			$("#tbxRegisterNickname")
				.ajaxValidator(
					{
						type: "GET",
						url: '<?php echo site_url('login/check_name')?>',
						datatype: "json",
						success:
							function(result)
							{
								return result.Result;
							},
						buttons: $("#ibtRegister"),
						onwait: "正在检测用户名是否重复...",
						onerror: "该用户名已被使用"
					});


  这里,演示了使用两个组(两个表单中有不同的控件)的使用,其中,只需要
validatorgroup: "1",(或2)去指定即可,十分方便. 这里还演示了使用
ajax提交验证的例子,使用的是ajaxValidator方法.

  总的来说,还是十分简单,这个控件,而且在各浏览器下运行得不错,属于可以
支持的国产jquery插件

你可能感兴趣的:(JavaScript,jquery)