比较 jQuery 时间选取器值

compare jquery timepicker values

本文关键字：选取 时间 jQuery 比较      更新时间：2023-09-26

将 timepricker 设置为 24 小时作为关注者： 

$(document).ready(function(){
    $('input.timepicker').timepicker({ 
        timeFormat: 'HH:mm', 
        minTime: '04:00',
        interval: 10,
        scrollbar: true,
        dynamic: true
    });
});

我有两个字段来获取开始和结束时间

<input type="text" class="timepicker" name="travelstart" id="travelstart" placeholder="Travel Start" style="width:25%"> 
<input type="text" class="timepicker" name="travelfinish" placeholder="Travel Finish" style="width:25%" readonly/>

需要某种方法来验证完成时间晚于开始时间。大致如下：

var ts = document.getElementById('travelstart')
var fs = document.getElementById('travelfinish')
if (ts.value => fs.value) { return false }

我假设你正在使用这个时间选择器jQuery插件。

首先，如果您只调用 document.getElementById('travelstart').value它以格式返回时间 "04:00 AM" 这可能不是您想要的，因此更好地使用：

$('#options-change-event').timepicker().getTime()

以获取实际的 JavaScript Date 对象。

然后将两个时间都转换为时间戳，然后进行比较：

var tsDate = $('#options-change-event').timepicker().getTime();
var tsMinutes = 60 * tsDate.getHours() + tsDate.getMinutes();
// ... the same with the seconds timepicker
return tsMinutes > tfMinutes;

您需要做的就是将时间转换为单个单位并进行比较。由于它只是一个 24 小时的时间选择器，我们可以在这里使用分钟：

var ts = document.getElementById('travelstart').value;
var fs = document.getElementById('travelfinish').value;
var startTime, endTime, timeArr;
// split the hours and minutes
timeArr = ts.split(':');
// Hours is in timeArr[0]; minutes in timeArr[1];
startTime = (timeArr[0] * 60) + +timeArr[1];
// do the same for end time:
timeArr = fs.split(':');
endTime = (timeArr[0] * 60) + +timeArr[1];
// Now you can compare them
return startTime >= endTime;
相关文章：