这次给大家带来jquery的validate插件怎样验证输入值，jquery的validate插件验证输入值的注意事项有哪些，下面就是实战案例，一起来看一下。
下面小编就为大家分享一篇jquery validate插件ajax方式验证输入值的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
项目中经常会遇到需要后台验证问题，如用户名、用户账号是否存在等。使用jquery validate插件可以使用remote校验规则完成验证。
示例：
一.基本用法
1.需要验证的表单
<form id="registform">
<input type="text" id="username" name="username">
</form>
2.js
使用remote校验规则，最简单粗暴的写法是remote: url，此时请求的url后面自动拼接当前验证的值，例如下面的写法，请求的url为：xxx/checkusername.do?username=test
// 导入jquery、validte库略
$(function() {
$.validator.setdefaults({
submithandler: function(form) {
// 验证通过处理
...
}
});
$(#registform).validate({
rules: {
username: {
required: true,
remote: checkusername.do
},
},
messages: {
username: {
required: 用户名不能为空,
remote: 用户名已经存在
}
}
});
});
3.后台（spring mvc测试）
后台响应只能输出true或false，不能有其他数据，true：验证通过，false：验证失败；设置返回类型为boolean或string都可以
(1).返回boolean
@requestmapping(/checkusername)
public @responsebody boolean checkusername(@requestparam string username) {
// 测试
return !test.equals(username);
}
(2).返回string
@requestmapping(/checkusername)
public @responsebody string checkusername(@requestparam string username) {
// 测试
return !test.equals(username) ? true : false;
}
二.其他用法
上面的用法不能满足实际的需求，有时候会有需要提交其他参数、参数名和属性名不一致或请求方式为post的情况，写法如下：
1.js
使用data选项，也就是jquery的$.ajax({...})的写法；
提交的数据需要通过函数返回值的方式，直接写值有问题；
默认会提交当前验证的值，也就是下例中的 username: xxx会被默认作为参数提交
....
username: {
required: true,
remote: {
url: checkusername.do,
type: post, //数据发送方式
datatype: json, //接受数据格式
data: { //要传递的数据
username: function() {
return $(#username).val();
},
extra: function() {
return 额外信息;
}
}
}
}
2.后台
限制了必须为post方式请求
@requestmapping(value = /checkusername, method = requestmethod.post)
public @responsebody boolean checkusername(user user, @requestparam string extra) {
// 测试
system.out.println(extra);
return !test.equals(user.getusername());
}
相信看了本文案例你已经掌握了方法，更多精彩请关注其它相关文章！
推荐阅读：
jackson解析json串时大小写自动转换的方法
ajax请求后台数据成功后无反映应该如何处理
jquery easyui 折叠面板的使用
jquery easyui选项卡面板的tabs使用
以上就是jquery的validate插件怎样验证输入值的详细内容。