jquery.validate提⽰错误信息位置⽅法
本⽂实例讲述了jquery.validate提⽰错误信息位置⽅法。分享给⼤家供⼤家参考，具体如下：
好长时间没有⽤jquery.validate.js这个插件了，忘得差不多了。唉，好东西还是要经常拿出来看看的，今天⽤jquery.validate来做⼀个⼩东西，遇到⼀个问题，就是错误提⽰信息的位置问题，如果知道的话，很简单。以前遇到过，可是忘了，现在标记⼀下，将来在忘了，在回过头看看。俗话说的好，好记性不如烂笔头。
举个例⼦，⼤家就知道怎么回事了。
rules: {
name:{
required:true,
rangelength:[1,20]
},
validateCode: {
required:true,
number:true,
rangelength:[5,5]
}
},
messages: {
name: {
required: "请输⼊命令名",
rangelength: jQuery.format("长度请控制在{0} ~ {1}")
},
validateCode: {
required: "请输⼊验证码",
number: "请输⼊数字",
rangelength: jQuery.format("长度必须是5位")
}
},
success: function(label) {
label.addClass("error checked");
},
submitHandler: function(form) {
if($("#RegionId").val() == '0'){
$("#citySelect").attr("class","error").html('请选择区域').show();
$("#RegionId").attr("class","error");
}else{
$("#RegionId").attr("class","valid");
$("#citySelect").attr("class","valid").html('success').show();
form.submit();
}
}
});
在上⾯的代码中，我并没有添加错误信息存放位置的⽅法，我们看⼀下效果
<td>
<input type="text" maxlength="30" value="" id="name" name="name">
<label for="name" generated="true">请输⼊命令名</label>
//错误信息会⾃动根在输⼊框的后⾯。
</td>
如果我们加上错误信息位置的⽅法errorPlacement来看⼀下效果是什么样⼦的。
rules: {
name:{
required:true,
rangelength:[1,20]
},
validateCode: {
required:true,
number:true,
rangelength:[5,5]
}
},
messages: {
name: {
required: "请输⼊命令名",
rangelength: jQuery.format("长度请控制在{0} ~ {1}")
},
validateCode: {
required: "请输⼊验证码",
number: "请输⼊数字",
rangelength: jQuery.format("长度必须是5位")
}
},
errorPlacement: function(error, element) { //错误信息位置设置⽅法
error.appendTo( element.parent().next() ); //这⾥的element是录⼊数据的对象
},
success: function(label) {
label.addClass("error checked");
},
submitHandler: function(form) {
if($("#RegionId").val() == '0'){
$("#citySelect").attr("class","error").html('请选择区域').show();
jquery是什么选择器$("#RegionId").attr("class","error");
}else{
$("#RegionId").attr("class","valid");
$("#citySelect").attr("class","valid").html('success').show();
form.submit();
}
}
});
来看⼀下效果
<tr>
<th><label for="name" id="lname"><code title="必填">*</code>命令名称</label></th> <td><input type="text" maxlength="30" value="" id="name" name="name"></td>
<td><label for="name" generated="true">请输⼊命令名</label></td>
//错误信息跑到这⼉来了，
</tr>
够简单吧，在简单的东西，长时间不⽤也会忘的。
更多关于jQuery插件相关内容感兴趣的读者可查看本站专题：《》
希望本⽂所述对⼤家jQuery程序设计有所帮助。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。