设为首页收藏本站

嘻皮客娱乐学习网

 找回密码
 中文注册
搜索
打印 上一主题 下一主题
开启左侧

[面试题库] 如何用JQuery进行表单验证

[复制链接]
跳转到指定楼层
楼主
发表于 2014-11-30 15:39:11 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式
可以使用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’})
}
});
回复

使用道具 举报

小黑屋|手机版|嘻皮客网 ( 京ICP备10218169号|京公网安备11010802013797  

GMT+8, 2024-5-29 05:01 , Processed in 0.172559 second(s), 21 queries , Gzip On.

Powered by Discuz! X3.3

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表