Jquery validate and open Tip 打造验证提示

进来用validate来做表单的验证，但是如果使用默认方式出来的效果确实不够赞……

于是想着能修改点什么，折腾了一下open tip 使用提示的方式来展示，效果确实有点不错了：）

首先使用validate除了表单的问题：你需要引入jquery 和 jquery.validate 的JS文件

然后就是提示的问题，因为想用提示框来展示，所以看了看open tip不错，于是集成进去，需要引入

opentip-jquery.min.js 和opentip.css 两个文件，因为验证依赖了jquery，所以导入的是open tip的jquery js文件

处理代码：

<script>
$(function() {
$("#login").validate({
onkeyup: false,
errorClass: 'error',
validClass: 'valid',
highlight: function(element) {
$(element).closest('div').addClass("f_error");
},
unhighlight: function(element) {
$(element).closest('div').removeClass("f_error");
},
rules : {
'm_name' : {
required : true,
},
'm_password' : {
required : true,
},
},
messages : {
m_name : "用户名不能为空",
m_password : "密码不能为空",
},
errorPlacement: function(error, element) {
var msgbox = $(element);
new Opentip(msgbox, $(error).text(), { style: "alert", target: true, tipJoint: "left", targetJoint: "right", containInViewport: false });
}
});
});
</script>