Question

我在表单中有三个输入控件，

日期（显示当前日期，但用户可以从日历中选择任何日期）
开始时间（当前时间）
结束时间（开始时间+30分钟）
在页面加载

HTML：

Date:<input type="text" name="txtdate" id="txtdate" />
Start time:<input type="time" name="txtstart" id="txtstart" />
End time:<input type="time" name="txtend" id="txtend" />

我使用jquery来完成这项工作，代码如下

jquery的：

$(document).ready(function() {

$("#txtdate").datepick({dateFormat:'yyyy-mm-dd',minDate: 0});

var d = new Date();
var month = d.getMonth()+1;
var day = d.getDate();
var year1 = d.getFullYear();

var hour = d.getHours();
var mins = d.getMinutes();

var today = year1 + '/' + month + '/' + day;
$("#txtdate").val(today);

var time = hour + ":" + mins;
$("#txtstart").val(time);

var a = time.split(':');
var totmins = (+a[0])* 60 + (+a[1])+30;
var nhour = Math.floor(totmins/60);
var nmins = totmins%60;

var ntime = nhour + ":" + nmins;    
$("#txtend").val(ntime);

});

在上面的代码中显示当前日期，时间并正确地将当前时间加起来30分钟，但有时在分配值时，开始时间和结束时间字段不显示时间！例如，

当前时间为12.00 AM时，开始时间和结束时间输入字段中未显示任何值

我没有看到代码中的任何错误，但由于我是jquery的新手，我需要知道我是否在这里做了任何错误（可能是在分配值时）还是有另一种方法可以做此？

注意：的应该注意的是，我使用 HTML 5输入类型时间控件来输入开始时间和结束时间

Answer 1

不要为这个复杂的＆＃34添加30分钟＆＃34;当你可以简单地使用已经擅长日期/时间数学的Date时的逻辑。

var d = new Date();

// ...

var thirtyMinutes = 30*60*1000;
var futureDate = new Date(d.getTime() + thirtyMinutes);
var ntime = futureDate.getHours() + ':' + futureDate.getMinutes();

Answer 2

我猜你的问题是，在你的开始时间加30分钟后，结束时间已经是第二天了。

以此为例。

开始时间：23.50 根据您的计算，+ 30分钟给您结束时间：24.20

24.20是输入[type ='time']

的无效值

编辑：雅各布的答案解决了你的错误算法的问题。

编辑2：修改雅各布的答案，这将为你提供endDate

var d = new Date(); //get current time.
var thirtyMinutes = 30*60*1000; //30 minutes in milliseconds
var futureDate = new Date(d.getTime() + thirtyMinutes); //current time in milliseconds + 30 minutes in milliseconds.
var endDateHour = futureDate.getHours();
var endDateMinutes = futureDate.getMinutes();
if (endDateMinutes<10) {
endDateMinutes = "0"+endDateMinutes;
}
var endDate = endDateHour + ':' + endDateMinutes;

jquery - 为输入无效的值分配值

2 个答案: