[ 登录注册 ]

Web开发

如何用JQuery进行表单验证?

2016-05-13 10:24:30 admin 返回上一页

可以使用jQuery的插件–jQuery-validate表单验证插件来进行表单验证

例子:

$(“#form”).validate({
//验证规则
rules:{
author:{
required:true,//必需非空字段
minlength:2??? ?//长度至少两字节
},
email:{
required:true,
email:true??? ?//此字段为邮件地址
},
url:{
required:false,
url:true??? //此字段为网址
},
content:{
required:true,
minlength:4
}
},
//错误消息
messages:{
author: {
required: ‘用户名必须填写’,
minlength:? jQuery.format(“名称至少{0}两个字节”)
},
email: {
required: ‘邮箱必须填写,做为联系方式’,
email: ‘邮箱格式不正确’
},
content: {
required: ‘网址必须填写’,
minlength: jQuery.format(“名称至少{0}两个字节”)
}
},
submitHandler: function(form) {
//ajax提交表单,需要jQuery.Form插件
$(form).ajaxSubmit({
dataType:’json’,
success:function(res){
if(res.success){
$(‘.ajaxsubmit’).html(‘发表成功!’).addClass(‘ok’);
$(‘textarea’).val(”);
$(‘#comments’).prepend(res.msg);
}else
$(‘.ajaxsubmit’).html(res.msg).addClass(‘fail’);
}
});
return false;
},
errorPlacement:function(error, element) {
//放置错误提示消息的Element
error.appendTo(element.parent().find(‘b’));
},
errorClass:’fail’,//错误消息样式
highlight: function(element, errorClass) {
//黄褪显示错误字段,需要jQuery.Highlight插件
$(element).highlightFade({color:’yellow’,speed:1000,iterator:’exponential’})
}
});


文章来源:http://www.bozhiyue.com/mianshiti/Webkaifa/2016/0513/97044.html
返回上一页    返回分类 上一篇:   下一篇:
相关