JQuery onChangeDate 事件手动更改日期

Question

我的页面中有 2 个 datepickers，我希望它们之间有 1 年的范围。到目前为止，每当其中一个发生变化时，我都会检查另一个的值并相应地更新它。

$("#DateFrom").datepicker().on("changeDate", function () {
  var dt = new Date($(this).val());
  dt.setFullYear(dt.getFullYear() + 1)
  var updateDate = new Date(dt);

  var dateFrom =$(this).val();
  var dateTo = $("#DateTo").val();

  if (new Date(dateFrom).getTime() > new Date(dateTo).getTime())
      $('#DateTo').val('');

  if (new Date(dateTo).getTime() > new Date(updateDate).getTime())
      $('#DateTo').datepicker('setDate', updateDate);
});


$("#DateTo").datepicker().on("changeDate", function (e) {
  var dt = new Date($(this).val());
  dt.setFullYear(dt.getFullYear() - 1)
  var updateDate = new Date(dt);

  var dateTo = $(this).val();
  var dateFrom = $("#DateFrom").val();

  if (new Date(dateFrom).getTime() > new Date(dateTo).getTime()) {
      $('#DateFrom').val('');
  }

  if (new Date(dateFrom).getTime() < new Date(updateDate).getTime()) {
      $('#DateFrom').datepicker('setDate', updateDate); 
  }
});

如果您 select 来自 datepicker 的日期，它工作正常，但如果您尝试手动输入它，则每当您输入内容时事件都会触发，并且它会计算出错误的日期。

例如，如果 #DateFrom 的值为 01/01/2016 并且我在删除 5 时将其手动更改为 '01/01/2015'，则事件会将当前日期设为 01/01/201 并且它会将更新日期计算为 01/01/202.

有没有办法在用户完成输入后触发事件？

提前致谢。

Answer 1

好的，看来我是通过从

更改这些行来解决它的

$("#DateFrom").focusout(function () 
$("#DateTo").focusout(function ()

到

$("#DateFrom").focusout(function () 
$("#DateTo").focusout(function ()

无论用户是从日期选择器中选择日期还是手动输入日期，.focusout() 事件似乎都能正常工作。

如果谁有更好的实现请post它。

JQuery onChangeDate 事件手动更改日期

JQuery onChangeDate event change date manually

jquery

datepicker

bootstrap-datepicker