layui日期插件和validate校验,日期要选择两次,红色错误提示才会消失

今天遇到的这个问题,说大也不大,说小也不小,折磨我一天了

最早找的是这篇博客当同时使用bootstrap-datepicker.js和jquery.validate.js这两款插件,至少要选择两次时间,才能验证成功的问题根据这篇文章的思路,我给要验证的日期input输入框绑定了一个click时间,当点击的时候,value为空,日期插件点击确定之前,实际上validate在一进来已经校验value了,所以当你选择好日期点击确定时,错误提示仍然存在,当再次选择的时候,clcik打印的是上一次的value,value有值所以放行,校验通过,这样日期插件就需要点击两次,红色错误才能消失这显示不符合我们的预期,laydate日期控件在值尚未回写时jquery就已经触发校验,所以每次校验的是之前的数据

刚开始思路局限于,input的onchange事件改变的时候,在调用一次validate验证,事实证明是错误的,最后采用一种简单粗暴的解决方法,当日期input失去焦点时,通过js手动去掉验证样式。

代码如下:

//#stratTime为日期插件input输入框的id

$("#stratTime").blur(function(){

  $("#stratTime").removeClass("error");

  $("#stratTime").next().css("display","none")

})

PS:方法里去除的样式,自己可以F12选中看看错误信息的样式如何去掉,仅提供一个思路,如果有更好的方法,欢迎评论区留言哦~

原文地址:https://www.cnblogs.com/qdkfyym/p/13143457.html