jquery中前台关于日期正确性的校验

Posted 2020-08-02 蜗牛也有春天

近期的项目总结中有一个关于日期控件的，之前的项目中对于日期控件的使用一般会有下面几个情况。

（1） 当点击可以文本框的时候弹出日历控件的选择画面，手动选择日历控件上的时间。这种做法有个极大的好处就是不需要做日期的正确性校验，一般情况也只是比较FROM和TO的关系，保证日期先后顺序的正确性。这个项目中也最常用。

（2） 点击日历符号的时候才弹出日历选择画面，文本框的内容可以手动的输入。这种情况下通常有两种校验方式，一种是在文本框的内容输入后，走js的方法，通过调用日期有效性判断，报出错误信息或者继续下一步的操作。另外一种就是针对文本框的输入内容，限定输入，通过keyup监听输入的内容，然后return想要的内容让一些字符的输入无效。

（3） 对于文本框的输入问题，通常情况下通过输入法的制御来控制只能输入英文字符和数字的制御，需要在后台做相应的代码处理，因为IE的文本框很傻，即使你限制了输入，对于万能的复制粘贴文本框还是无法拒绝的。

另外一个跟这个校验关系不大的，就是文本框的无效设定以后，无效的文本内容是取不到的。通常情况下，都是采用隐藏变量的方法来解决。

日期有效性验证的代码参照下面的代码：

 1 function isValidateDate(date) {
 2      date = $.trim(date);
 3      var reg = /^(\\d{4})-(\\d{2})-(\\d{2})$/;
 4      reg.exec(date);
 5      if (!reg.test(date) && RegExp.$2 <= 12 && RegExp.$3 <= 31) {
 6          return false;
 7      }
 8      var year, month, day;
 9      year = parseInt(date.split("-")[0], 10);
10      month = parseInt(date.split("-")[1], 10);
11      day = parseInt(date.split("-")[2], 10);
12      if (! ((1 <= month) && (12 >= month) && (31 >= day) && (1 <= day))) {
13          return false;
14      }
15      if ((month <= 7) && ((month % 2) == 0) && (day >= 31)) {
16          return false;
17      }
18      if ((month >= 8) && ((month % 2) == 1) && (day >= 31)) {
19          return false;
20      }
21      if (month == 2) {
22          if ((year % 400 == 0) || ((year % 4 == 0) && (year % 100 != 0))) {
23              if (day > 29) {
24                  return false;
25              }
26          } else {
27              if (day > 28) {
28                  return false;
29              }
30          }
31      }
32      return true;
33  }

View Code