根据一天中的时间设置默认选项选择值答案

【问题标题】：set default option selected value based on time of day根据一天中的时间设置默认选项选择值
【发布时间】：2014-11-04 15:56:47
【问题描述】：

我有一个创建函数并设置每天执行该函数的时间的表单。

我想更改我在 07:00 设置的“选定”值，以根据用户的当前时间选择该值，四舍五入到下一小时。

任何想法我可以如何最好地在 javascript 或使用 jQuery mod 中实现这一点？

这里是标记示例，只是为了给您一个视觉效果。

换句话说，而不是：

<option value="07:00" selected>7:00 am</option>

它只是：

<option value="07:00">7:00 am</option>

... 与其他选项值一样，但会根据本地时间的下一个可用小时为用户选择默认值。

如果可以提供更好的示例，请查看完整列表：

<select id="ExecutionTime" name="ExecutionTime">
<option value="00:00">12:00 am</option><option value="01:00">1:00 am</option><option value="02:00">2:00 am</option><option value="03:00">3:00 am</option><option value="04:00">4:00 am</option><option value="05:00">5:00 am</option><option value="06:00">6:00 am</option><option value="07:00" selected>7:00 am</option><option value="08:00">8:00 am</option><option value="09:00">9:00 am</option><option value="10:00">10:00 am</option><option value="11:00">11:00 am</option><option value="12:00">12:00 pm</option><option value="13:00">1:00 pm</option><option value="14:00">2:00 pm</option><option value="15:00">3:00 pm</option><option value="16:00">4:00 pm</option><option value="17:00">5:00 pm</option><option value="18:00">6:00 pm</option><option value="19:00">7:00 pm</option><option value="20:00">8:00 pm</option><option value="21:00">9:00 pm</option><option value="22:00">10:00 pm</option><option value="23:00">11:00 pm</option>                  
</select>

我是不是疯了，或者这可以在 js 中轻松完成吗？

【问题讨论】：

将 new Date().getHours();工作？还是必须是非 24 时钟？

标签： javascript jquery

【解决方案1】：

var now = new Date();
var curHour = now.getHours();
if (now.getMinutes() != 0) {
    curHour = (curHour + 1) % 24; // round up
}
var hourString = (curHour < 10 ? "0" : "") + curHour + ":00";
$("#ExecutionTime option[value='"+hourString+"']").attr('selected', true);
$("#ExecutionTime option:not([value='"+hourString+"'])").attr('selected', false);

【讨论】：

Barmar，我真的不明白，所以我用的是另一个，但也想给你一点意见。我试图摆弄它，但无法让它工作。我在哪里错了？ jsfiddle.net/karixa/bk1r3yo7

【解决方案2】：

这将自动填充下拉菜单，然后选择当前时间。

var d = new Date().getHours(); // get the hour in 24 hour format
var a = d > 11 ? "pm" : "am"; /// get AM or PM
var hour = ((d + 11) % 12 + 1); // Convert 24 hours to 12 
selectList.val(hour + ':00 ' + a); // Set the dropdowns selected value

http://jsfiddle.net/sa9nqfxm/

【讨论】：

应该是var a = d > 11 ? "pm" : "am";
哦，那太完美了——我想知道数学差异，12 小时休息。上面的更正解决了这个问题。
除了你所做的之外，我还加入了一个准备好的函数，并随着时间和变量的变化而变化。这工作正常，但由于某种原因，当我插入我的页面时，它实际上并没有填充表单。不知道为什么......将不得不更多地玩它。 jsfiddle.net/karixa/zx292xom
您不需要在 JSFiddle 中准备好语句，如果您查看 jquery 下拉菜单上的下拉菜单，它就有该选项。
这实际上效果很好 - 但我有一些其他的 js 与我的页面冲突，所以它实际上抹去了我所拥有的。 JS 有时可以成为真正的药丸。

【解决方案3】：

var selectList = $('#selectDropdown');
for(var i =0; i < 24; i++){
    var hour = ((i + 11) % 12 + 1);
    var a = i > 11 ? "pm" : "am";
    selectList.append('<option value="'+ hour + ':00 '+a+'" >'+ hour + ':00 '+a+'</option>');        
}

var d = new Date().getHours();
var a = i > 11 ? "pm" : "am";
var hour = ((d + 11) % 12 + 1);
selectList.val(hour + ':00 ' + a);

【讨论】：