我正在尝试做一些简单的计算,我需要一个约会并在那个日期添加x个月。搜索之后,我决定使用DateJS来计算边缘日期。
我设置了一个表单,允许用户输入日期和月数。在键盘功能上,它计算新日期。问题是它没有正确计算。
我可以将日期从表单传递给JS,并在JS中手动指定月份并正确计算。如果我从表格中传递了日期和月份,则计算结果很多。事实上多年了!
如果我用一个硬编码的数字替换$("#monthincrease")。val(),计算工作正常。但不是在使用表单中的数据时。
<div class="container">
<div class="jumbotron">
<h1>Future Date Calculator</h1>
<p>To calculate a future date, enter a start date and the amount of months to add.</p>
</div>
<div class="row">
<div class="col-lg-12">
<form class="form-inline" role="form">
<div class="form-group">
<label for="startdate">Start Date:</label>
<input type="date" class="form-control" id="startdate">
</div>
<div class="form-group">
<label for="monthincrease"> And Months To Add:</label>
<input type="number" class="form-control" id="monthincrease">
</div>
</form>
<p>Date: <span class="futuredate"></span></p>
<p>Month: <span class="month"></span></p>
</div>
</div>
<script type="text/javascript">
$("#monthincrease").on('keyup',function() {
var newDate = Date.parse( $("#startdate").val() ).addMonths( $("#monthincrease").val() );
$(".futuredate").html(newDate);
$(".month").html( $("#monthincrease").val() );
});
</script>
这是我更新的代码。
<div class="container">
<div class="jumbotron">
<h1>Future Date Calculator</h1>
<p>To calculate a future date, enter a start date and the amount of months to add.</p>
</div>
<div class="row">
<div class="col-lg-12">
<form class="form-inline" role="form">
<div class="form-group">
<label for="startdate">Start Date:</label>
<input type="date" class="form-control" id="startdate">
</div>
<div class="form-group">
<label for="monthincrease"> And Months To Add:</label>
<input type="number" class="form-control" id="monthincrease">
</div>
</form>
<p>Date: <span class="futuredate"></span></p>
</div>
</div>
<script type="text/javascript">
$( document ).ready(function() {
$("#monthincrease").on('keyup',function() {
var incMonths = $("#monthincrease").val();
var startDate = $("#startdate").val();
var newDate = new Date.parseExact( startDate, "yyyy-MM-dd" ).addMonths( incMonths );
$(".futuredate").html(newDate);
console.log(incMonths);
console.log(startDate);
console.log(newDate);
});
});
</script>
</div>
答案 0 :(得分:0)
尝试在document.ready块中输入您的事件代码。另外,为了正确计算,请使用DateJS库的parseExact方法,并指定在文本框中输入日期的格式。 https://code.google.com/p/datejs/wiki/APIDocumentation
更新:
$( document ).ready(function() {
$("#monthincrease").on('keyup',function() {
var incMonths = $("#monthincrease").val();
var startDate = $("#startdate").val();
var newDate = new Date.parseExact( startDate, "M/d/yyyy" ).addMonths( parseInt(incMonths ));
$(".futuredate").html(newDate);
});
});
我更正了日期格式并使用了parseInt for months字段。现在试试吧。
答案 1 :(得分:0)
我将var更改为var incMonths = Number($(&#34;#monthincrease&#34;)。val());它将表单输入转换为数字。立即行动。