自动检测时间和更改DropDown

时间:2015-11-16 13:59:07

标签: javascript jquery html

当页面加载时我希望我的下拉列表根据时间更改值。

例如,如果我要在13:27打开页面,它应该在下拉列表中显示14:00。

如果我要在10:07打开页面,则应在下拉列表中显示11:00。

如何在Javascript / jQuery中完成。

我看过get / getElementbyID('date')。value = Date();但无法理解。

我想知道nationalxpress是如何做到的。 http://www.nationalexpress.com/home.aspx

<select id="leavedrop">
     <option value="" disabled selected>Please Select</option>
        <option>00:00</option>
        <option>01:00</option>
        <option>02:00</option>
        <option>03:00</option>
        <option>04:00</option>
        <option>05:00</option>
        <option>06:00</option>
        <option>07:00</option>
        <option>08:00</option>
        <option>09:00</option>
        <option>10:00</option>
        <option>11:00</option>
        <option>12:00</option>
        <option>13:00</option>
        <option>14:00</option>
        <option>15:00</option>
        <option>16:00</option>
        <option>17:00</option>
        <option>18:00</option>
        <option>19:00</option>
        <option>20:00</option>
        <option>21:00</option>
        <option>22:00</option>
        <option>23:00</option>
</select>  

1 个答案:

答案 0 :(得分:1)

首先,更新选项标签以获得值

<option value="" disabled selected>Please Select</option>
<option value="0">00:00</option>
<option value="1">01:00</option>
<option value="2">02:00</option>
...

之后,这里有一个javascript代码来获取当前时间并相应地选择选项:

var hourToSelect = new Date().getHours() + 1;
if(hourToSelect === 24) hourToSelect = 0;

$("option[value='" + hourToSelect + "']").attr('selected', 'selected');