将当前时间转换为最近的半小时

Question

我有一个显示为单选按钮的时间列表。我想使用 JavaScript 来选择最接近用户当前时间的那个。我已经在我的网站上使用 jquery（如果这很重要）。此外，我还有另一组单选按钮，我想默认选择从“最早可接受时间”开始 +3 小时。

<label for="select-choice-etime">Earliest acceptable time:</label>
<select name="select-choice-etime" id="select-choice-etime">
    <option value="12:00 AM">12:00 AM</option>
    <option value="12:30 AM">12:30 AM</option>
    <option value="1:00 AM">1:00 AM</option>
    <option value="1:30 AM">1:30 AM</option>
    <option value="2:00 AM">2:00 AM</option>
    <option value="2:30 AM">2:30 AM</option>
    <option value="3:00 AM">3:00 AM</option>
    <option value="3:30 AM">3:30 AM</option>
    <option value="4:00 AM">4:00 AM</option>
    <option value="4:30 AM">4:30 AM</option>
    <option value="5:00 AM">5:00 AM</option>
    <option value="5:30 AM">5:30 AM</option>
    <option value="6:00 AM">6:00 AM</option>
    <option value="6:30 AM">6:30 AM</option>
    <option value="7:00 AM">7:00 AM</option>
    <option value="7:30 AM">7:30 AM</option>
    <option value="8:00 AM">8:00 AM</option>
    <option value="8:30 AM">8:30 AM</option>
    <option value="9:00 AM">9:00 AM</option>
    <option value="9:30 AM">9:30 AM</option>
    <option value="10:00 AM">10:00 AM</option>
    <option value="10:30 AM">10:30 AM</option>
    <option value="11:00 AM">11:00 AM</option>
    <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>
    <option value="5:00 PM">5:00 PM</option>
    <option value="5:30 PM">5:30 PM</option>
    <option value="6:00 PM">6:00 PM</option>
    <option value="6:30 PM">6:30 PM</option>
    <option selected="selected" value="7:00 PM">7:00 PM</option>
    <option value="7:30 PM">7:30 PM</option>
    <option value="8:00 PM">8:00 PM</option>
    <option value="8:30 PM">8:30 PM</option>
    <option value="9:00 PM">9:00 PM</option>
    <option value="9:30 PM">9:30 PM</option>
    <option value="10:00 PM">10:00 PM</option>
    <option value="10:30 PM">10:30 PM</option>
    <option value="11:00 PM">11:00 PM</option>
    <option value="11:30 PM">11:30 PM</option>
</select>

Answer 1

假设您想将分钟向上四舍五入到最接近的 00/30/60，您可以使用上限函数：

var now = new Date();
now.setMinutes(Math.ceil(now.getMinutes() / 30) * 30);

// Test cases:
// Math.ceil( 0 / 30) * 30 =  0
// Math.ceil( 1 / 30) * 30 = 30
// Math.ceil(30 / 30) * 30 = 30
// Math.ceil(31 / 30) * 30 = 60
// Math.ceil(59 / 30) * 30 = 60
//
// Note that setMinutes(60) increments the hour and sets the minute equal to zero

var h12h = now.getHours();
var m12h = now.getMinutes();
var ampm;
if (h12h >= 0 && h12h < 12) {
    if (h12h === 0) {
        h12h = 12; // 0 becomes 12
    }
    ampm = "AM";
}
else {
    if (h12h > 12) {
        h12h -= 12; // 13-23 becomes 1-11
    }
    ampm = "PM";
}
var timeString = h12h + ":" + ("00" + m12h).slice(-2) + " " + ampm;
$("#select-choice-etime").val(timeString);

注意：将 ceil 替换为 round 以映射分钟 00...14 到 00、15...44 到 30 和 44...59 到 60。

Demo here

Answer 2

这是一个将当前时间转换为选项中使用的最接近半小时的函数（例如，最接近的“10:30 PM”类型时间），然后使用该时间来选择正确的选项。

function getNearestHalfHourTimeString() {
    var now = new Date();
    var hour = now.getHours();
    var minutes = now.getMinutes();
    var ampm = "AM";
    if (minutes < 15) {
        minutes = "00";
    } else if (minutes < 45){
        minutes = "30";
    } else {
        minutes = "00";
        ++hour;
    }
    if (hour > 23) {
        hour = 12;
    } else if (hour > 12) {
        hour = hour - 12;
        ampm = "PM";
    } else if (hour == 12) {
        ampm = "PM";
    } else if (hour == 0) {
        hour = 12;
    }

    return(hour + ":" + minutes + " " + ampm);
}

您可以选择所需的选项：

// remove any previous selection
$('#select-choice-etime option').removeAttr('selected');

// select the one that matches the current time
$('#select-choice-etime option[value="' + getNearestHalfHourTimeString() + '"]').attr('selected', 'selected');​

你可以在这里看到它的工作原理：http://jsfiddle.net/jfriend00/Zz7pW/

Answer 3

那里！这将使您开始：

var time = new Date(),
  hours = time.getHours(),
  minutes = (time.getMinutes().length < 2) ? time.getMinutes() : '0' + time.getMinutes();
ampm = 'AM';

if (hours.match(/[13-23]/)) {
  ampm = 'PM';
}

// You have to convert 13 to 1, 14 to 2 etc.

Answer 4

这个是根据查询字符串中的格林威治标准时间tz=GM：

$(document).ready(function() {

    $.getJSON("http://json-time.appspot.com/time.json?tz=GMT&callback=?", function(data) {
        var GMT3 = data.hour; // data.hour+3 (if you want to use GMT+3
        if (data.minute < 15) {
            alert("Current Time is: " + GMT3 + " Selected  is " + GMT3 + ":00");
        }
        else if (data.minute < 45) {
            alert("Current Time is: " + GMT3 + " Selected is" + GMT3 + ":30");
        }
        else {
            alert("Current Time is: " + GMT3 + " Selected is" + GMT3 + 1 + ":00");
        }
    })
});​

getJSON 方法返回：

{
  "tz": "GMT", 
  "hour": 8, 
  "datetime": "Thu, 01 Mar 2012 08:12:25 +0000", 
  "second": 25, 
  "error": false, 
  "minute": 12
}

Answer 5

首先，您可以检查此代码。

var now = new Date();
var hour = now.getHours();
var min = now.getMinutes();
var ext = hour > 11 ? 'PM' : 'AM';

var tempRes = $("<select>");
// first we select all PM or AM and append to temp element
$("#select-choice-etime > option[value$='" + ext + "']").appendTo(tempRes);

// and then we select current hour elements within PM or AM
var result = tempRes.find("option[value^='" + hour + "']");

// finally we have two elements in result variable
// for example if hour is 10:12 PM
// result has two items which are 10:00 PM and 10:30 PM
//
// i think you can solve from there