easyui-validatebox 的自定义验证和ajax验证是否存在

做项目用的jquery的EastUI组件，在弄表单验证琢磨了下用法，想实现自定义验证和ajax异步验证存在与否，实现效果如下：

做之前先知道EasyUI的验证规则说明（EasyUI文档说明）：

Easyui remote规则
验证规则是通过使用 required 和 validType 属性来定义的，这里EasyUI自带的validatebox.defaults.rules中有4种规则：

email：匹配 email 正则表达式规则。
url：匹配 URL 正则表达式规则。
length[x, y]： 允许x~y个字符
remote[url, paramName]：发送 ajax 请求来验证值，成功时返回 ‘true’ 。

validType 用于定义字段的验证规则。其值可为string, array, object类型。

三种用法

1. 单个规则用法

<input class="easyui-textbox" type="text" name="username" data-options="required:true,validType:'username'" />  

2. 多个规则用法(validType值为数组或对象字面量格式)

• 数组

<span>validType为字符串数组</span> <input type="text" id="arr"> <br>
<script>
    $("#arr").validatebox({
        required: true,
        validType: [
            "email",
            "length[5, 6]",
            "remote['/GetAuthCode', 'inputCode']"
        ]
    });
</script>

• 对象(需要注意的是email,url这样没有参数的规则必须写成名值对的形式)。

<span>validType为对象</span> <input type="text" id="obj"> <br>

<script>
    $("#obj").validatebox({
        required: true,
        validType: {
            email: "",  // 不传参数，值为空字符串。
            length: [3, 5],
            remote: ["GetAuthCode", "inputCode"]
        }
    });
</script>

HTML代码

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>

/*……*/

用户编号：<input class="easyui-textbox" type="text" id="number" name="number" data-options="required:true" 
			validType="remote['${ctx}/checkUsername', 'number', '用户已被存在']" />
手机号码：<input class="easyui-textbox" type="text" id="phone" name="phone" data-options="required:true" 
			validType="remote['${ctx}/checkPhone', 'phone', '手机号码已被注册']" /> 

JS代码

$.extend($.fn.validatebox.defaults.rules, {
			remote: {
				validator: function(value,param){
					if(param[1] == 'phone') {
						if(!/^0{0,1}1[3,5,8][0-9]{9}$/.test(value)) {
							$.fn.validatebox.defaults.rules.remote.message = '手机号号码格式不对';
							return false;
						}  
					} else if(param[1] == 'number') {
						if(!/^[1-9]\d{4,9}$/.test(value)) {
							$.fn.validatebox.defaults.rules.remote.message = '不能以0开头，请输入6位编号';
							return false;
						} 
					}
					var exist = $.ajax({
						url: param[0],
						data: param[1] + "=" + value,
						async: false,
						type: "POST",
					}).responseText;
					if (exist == '1') {
						$.fn.validatebox.defaults.rules.remote.message = param[2];
						return false;
					} else 
						return true;
				},
				message: ''		
			}
		}); 

Controller层

//ajax查询用户是否存在
	@RequestMapping("/checkUsername")
	@ResponseBody
	public String checkUsername(String number) {
		User user = service.findByNumber(number);	
		if (user != null) {
			System.out.println("该用户已存在");
			return "1";
		} else {
			System.out.println("用户不存在");
			return "0";
		}
		
	}

//ajax查询注册手机是否存在
	@RequestMapping("/checkPhone")
	@ResponseBody
	public String checkPhone(String phone) {
		System.out.println("checkPhone begin");
		User user = service.findByPhone(phone);
		if (user != null) {
			return "1";
		} else {
			return "0";
		}
		
	}

总结
有一个问题，就是这个方法放在外引的js文件会无效，放在jsp下的<script>标签里就可以使用，我也是很奇怪，待解决……