datepicker valid()函数检查日期是否有效

时间:2016-04-01 09:30:45

标签: javascript jquery datepicker

我将此datepicker定义为date-picker类。 我想检查日期是否有效,我的意思是当用户通过键盘修改日期时,例如,如果输入的日期超过31或月份超过12,则应该给出错误。 我写了这个isValidDate函数,但它不能正常工作。我在某处读到了针对datepickers的valid()函数。

jsFiddle



$(function() {
  $(".date-picker").datepicker({
    dateFormat: 'dd/mm/yy'
  });

  $(".date-picker").each(function() {
    $(this).add($(this).next()).wrapAll('<div class="imageInputWrapper"></div>');
  });

  $('input:button').click(function(e) {
    $("#fDate").removeClass("red");

    var fromDate = $("#fDate").val();

    if (!isValidDate(fromDate)) {
      $("#fDate").addClass("red");
    }

    if (errors) e.preventDefault();
  });

  function isValidDate(date) {
    var matches = /^(\d{2})[-\/](\d{2})[-\/](\d{4})$/.exec(date);
    if (matches == null) return false;
    var d = matches[2];
    var m = matches[2];
    var y = matches[3];

    if (y > 2100 || y < 1900) return false; // accept only recent & not too far years

    var composedDate = new Date(y, m, d);
    return composedDate.getDate() == d && composedDate.getMonth() == m && composedDate.getFullYear() == y;
  }
});
&#13;
.imageInputWrapper {
  width: 172px;
  border: solid 1px white;
  background-color: white;
  display: flex;
  align-items: center;
  box-shadow: 0 2px 2px 0 #C2C2C2;
}
.red {
  box-shadow: 0px 0px 2px 2px red;
}
&#13;
<script src="https://code.jquery.com/jquery-1.9.1.js"></script>
<script src="https://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<form>
  <input id="fDate" class="date-picker" type="text" name="fromDate" style="width: 130px; height: 41px; background-color: white; border: none; outline: none; margin-left:5px" />
  <img src="http://s9.postimg.org/nl2mcq2rv/calendar.png" id="fromDateImgId">
  <br/>
  <input type="button" value="submit">
  </table>
</form>
&#13;
&#13;
&#13;

如果您在日期部分插入44,则不会在我的代码中出现任何错误。

2 个答案:

答案 0 :(得分:1)

您的代码运行正常。只是稍微调整一下。

function isValidDate(date) {
    var matches = /^(\d+)[-\/](\d+)[-\/](\d+)$/.exec(date);
    if (matches == null) return false;
    var d = matches[1];
    var m = matches[2];
    var y = matches[3];
    if (y > 2100 || y < 1900) return false; 
    var composedDate = new Date(y+'/'+m+'/'+d);
    return composedDate.getDate() == d && composedDate.getMonth()+1 == m && composedDate.getFullYear() == y;
  }

工作小提琴:https://jsfiddle.net/ppw1k3yu/1/

答案 1 :(得分:0)

您可以使用Date.parse()作为验证功能。

实施例

function isValidDate(str) {
  return !isNaN(Date.parse(str));
}