javascript - 热衷于采用文本框值来计算日期差异？

Question

我是 JavaScript 新手，正在尝试计算日期差异。我正在尝试从 text-box 的值获取一个 date，并从 date-picker 获取另一个 date。但是在计算差异时它给了我错误的答案。

这是我的代码:

$('#ELEdatepicker1').datepicker({
autoclose: true,
startDate: new Date(),
todayHighlight: true,
}).change(function(){
getELEdifference($(this));
});
// var ELEexpDate = document.getElementById('#ELEtextDate').value;
var ELEexpDate = document.getElementById('#ELEtextDate');
function getELEdifference($this)
{
if($this.datepicker("getDate") != null)
{
var ELEcertDiff= ELEexpDate - $this.datepicker("getDate");    
var result = Math.round(ELEcertDiff / (1000 * 60 * 60 * 24) * -1);
if(result == 1095 || result == 1825 || result == 3652)
{
document.getElementById("ELEcertDiff").value = result;
} else {
alert('Are you sure ?');
document.getElementById("ELEcertDiff").value = result;
}
}
}

这是我的jsfiddle: https://jsfiddle.net/2trf5a8y/32/

我很困惑我在哪里犯了错误。请帮助我，提前致谢。

Answer 1

我在您的代码中发现了两个问题。 document.getElementById('#ELEtextDate') 行不会给出文本框的值。您必须更改其中任何一项。

document.getElementById('ELEtextDate').value

或

$('#ELEtextDate').val()

现在第二个问题是你不能直接减去非日期值，这意味着你必须将你的值转换为日期格式，然后你才能减去。该行

 var ELEcertDiff= ELEexpDate - $this.datepicker("getDate"); 

应更改为

 var ELEcertDiff= new Date(ELEexpDate) - $this.datepicker("getDate"); 

Updated Demo

我在以下代码片段中实现了相同的内容

$('#ELEdatepicker1').datepicker({
autoclose: true,
startDate: new Date(),
todayHighlight: true,
}).change(function(){
getELEdifference($(this));
});
// var ELEexpDate = document.getElementById('#ELEtextDate').value;
var ELEexpDate = document.getElementById('ELEtextDate').value;
function getELEdifference($this)
{
if($this.datepicker("getDate") != null)
{
var ELEcertDiff= new Date(ELEexpDate) - $this.datepicker("getDate");
var result = Math.round(ELEcertDiff / (1000 * 60 * 60 * 24) * -1);
if(result == 1095 || result == 1825 || result == 3652)
{
document.getElementById("ELEcertDiff").value = result;
} else {
alert('Are you sure ?');
document.getElementById("ELEcertDiff").value = result;
}
}
}

<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet" />
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
Date:<input type="text" id="ELEdatepicker1"><br><br>
Diff:<input type="text" id="ELEcertDiff"><br><br>
Days:<input type="text" id="ELEtextDate" value="01/01/2012"><br><br>