Question

我有一个时间列表的下拉列表。

我的条件是 -

select only option whose value is just greater than current time

但是，我已经实现了我可以做到的方式，这种方法很好但是必须有更好的方法来做到这一点，我担心我的实现可能会在某些条件下中断。

这就是我所做的 -

HTML -

   <select name="RunID" id="RunID" >
    <option>Select Departure Time...</option>
    <option value="09:00:00">09:00</option>
    <option value="12:30:00" >12:30</option>
    <option value="15:30:00">15:30</option>
    <option value="18:30:00">18:30</option>
    <option value="22:30:00">22:30</option>
    <option value="01:30:00">01:30</option>
</select>

的jQuery

   var arrayTimes = [];

 $('#RunID option').not(':first-child').each(function () {

 var timeNow = new Date().toTimeString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1");

 if (Date.parse('01/01/2011 ' + $(this).val())
     > Date.parse('01/01/2011 ' + timeNow)) {

         arrayTimes.push($(this));
        }
     });

if (arrayTimes.length > 0) {
     arrayTimes[0].attr('selected', 'selected');
   }

和Demo

修改 -

可能这个问题造成混乱，所以我只是举个例子。在我的下拉列表中，有时会09:00:00，12:30:00，15:30:00 ......

现在当前时间 12:58:25 秒。

因此默认选择的值为15:30:00，因为这比当前时间的值更接近。

另外，我不是要禁用任何与条件不匹配的值！

Answer 1

试试这个：

JS：

var D = new Date();
var T = D.getTime();
var options = $('#RunID option[data-departuretime]');
var op = options.filter(function (el) {
    var d = new Date(D.getFullYear() + " " + (D.getMonth() + 1) + " " + D.getDate() + " " + $(options[el]).attr("data-departuretime"));
    return d.getTime() > T;
});
$(op[0]).attr("selected", "selected");

HTML：

<select name="RunID" id="RunID">
    <option>Select Departure Time...</option>
    <option data-departuretime="09:00:00">09:00</option>
    <option data-departuretime="13:35:10">13:35:10</option>
    <option data-departuretime="15:30:00">15:30</option>
    <option data-departuretime="18:30:00">18:30</option>
    <option data-departuretime="22:30:00">22:30</option>
    <option data-departuretime="01:30:00">01:30</option>
</select>

演示：http://jsfiddle.net/m39eodde/2/

Answer 2

您可以简单地将较旧的选项设置为已禁用，以便用户无法选择它们。

<option value="09:00:00" disabled>09:00</option>

用jQuery作为

$('#RunID option').prop('disabled', true)

从下拉列表中选择较大的值

2 个答案: