使用 Ajax 提交时 validate 插件如何手动校验
通常我们采用 <input type="submit"> 提交表单，此时配置的 validate 插件就会自动进行校验，而如果我们使用 Ajax 提交这个表单，该如何继续使用 validate 提供的校验功能呢？
方法一
我们可以为 submitHandler 属性配置一个函数，该函数在用户点击提交按钮并校验通过后才会触发，所以我们可以在这个函数中发起 Ajax 请求。
<html lang="zh-CN">
<head>
<title>读者墙</title>
<style type="text/css">
.error {
color: red;
font-weight: 7;
padding-left: 10px;
}
</style>
<script src="/js/jquery-2.1.4.min.js"></script>
</head>
<body class="user-select">
<form id="form" class="form-horizontal" method="post">
<input type="email" name="email" >
<textarea id="content" name="content"></textarea>
<button type="submit" >提交</button>
</form>
<script src="/js/jquery.validate.min.js"></script>
<script>
$(function() {
$("#form").validate({
submitHandler : function(form) { //验证通过后执行的方法
var formData = $("#form").serialize();
$.post(
"${pageContext.request.contextPath}/user/message/add.action",
formData,
function(data) {
//请求成功
},
"json"
);
},
rules : {
title : {
"required" : true
},
email : {
"required" : true,
"email" : true
},
content : {
"required" : true
}
},
messages : {
title : {
"required" : "必填",
},
email : {
"required" : "必填",
"email" : "请输入正确的邮箱格式"
},
content : {
"required" : "必填",
}
}
});
});
</script>
</body>
</html>
方法二
可以使用 valid() 方法进行手动校验：
var tag = $("#form").valid();//返回 true 表示验证通过
if(tag){
$.post(
);
}如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
下一篇： 谈谈自己对于 AOP 的了解
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论