javascript - 比较两个使用日期选择器的日期

Question

我有一个包含两个日期字段的表单。我试图从两个输入中选择日期并将它们与 JQuery 进行比较。我遇到的问题是它返回 NaN。

我认为可能是因为日期上的 typeof 返回字符串。

$('#id_date_completed').change(function() {
    date_received = $("#id_date_received").val(); 
    date_completed = $("#id_date_completed").val(); 

    var diff = date_completed - date_received;
    var days = diff / 1000 / 60 / 60 / 24;

    console.log(days);
}

编辑

我的问题不同于 Get difference between 2 dates in javascript?因为我正在使用 bootstrap-datepicker 库。 Arun P Johny 的回答很完美

Answer 1

问题是 .val() 将返回一个字符串，因此 date_received 和 date_completed 都是字符串值，因此减去它们将返回 NaN.

相反，您可以使用 getDate() bootstrap-datepicker 的方法

$("#id_date_received, #id_date_completed").datepicker();

$('button').click(function() {
  var date_received = $("#id_date_received").datepicker('getDate');
  var date_completed = $("#id_date_completed").datepicker('getDate');

  var diff = date_completed - date_received;
  var days = diff / 1000 / 60 / 60 / 24;
  $('span').text(days)
})

<link href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.0/css/bootstrap-datepicker.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.0/js/bootstrap-datepicker.js"></script>

<input id="id_date_received" />
<input id="id_date_completed" />
<button>Test</button>
<span></span>