javascript - 如何制作一个选择下拉菜单以根据当前时间选择一个选项值

Question

我有一个以 30 分钟为间隔的时间选择下拉菜单，例如

11:00 AM, 11:30 AM, 12:00 PM, 12:30 PM, 1:00 PM

从上午 0:00 开始到晚上 11:30 结束

<select id='time'>
  <option value="11:30 AM">11:30 AM</option>
  <option value="12:00 PM">12:00 PM</option>
  <option value="12:30 PM">12:30 PM</option>
  <option value="1:00 PM">1:00 PM</option>
 <option value="1:30 PM">1:30 PM</option>
 <option value="2:00 PM">2:00 PM</option>
 <option value="2:30 PM">2:30 PM</option>
 <option value="3:00 PM">3:00 PM</option>
 <option value="3:30 PM">3:30 PM</option>
 <option value="4:00 PM">4:00 PM</option>
 <option value="4:30 PM">4:30 PM</option>
</select>

$(document).ready(function(){

  $('#time').val(.now()); // this wouldnt work it gives the current time which may be between 30 min 

});

我希望此选择下拉列表默认为基于当前时间四舍五入到最接近的较高时间。

例如。如果当前时间是上午 10:46，则所选值应为上午 11:00，如果当前时间为上午 10:31，则也应默认为上午 11:00。

有关使用 jquery 或普通 javascript 实现此目的的任何指示。

谢谢

Answer 1

您可以使用 Math.round 函数来获取最接近半小时的值:

Math.round(Date.now()/(30*60*1000))*(30*60*1000));

由此构造一个日期对象并获取时间。

var date = new Date(Math.round(Date.now() / (30 * 60 * 1000)) * (30 * 60 * 1000));
$('#time').val(date.getHours()%12 + ":" + ("0"+date.getMinutes()).slice(-2) + " " + (date.getHours() >= 12 ? "PM" : "AM"));

这是一个演示:http://jsfiddle.net/GsR6v/9/