如何使用jQueryUI datepicker和HTML5时间输入比较日期/时间值？ [英] How can I compare date/time values using the jQueryUI datepicker and HTML5 time input?

问题描述

我想验证开始日期/时间对早于页面上的结束日期/时间对。我正在使用jQueryUI datepicker和HTML5时间输入元素/小部件。

I want to validate that the "begin" date/time pair predates the "end" date/time pair on a page. I'm using the jQueryUI datepicker, and the HTML5 time input element/widget.

这个jQuery：

    var begD = $.datepicker.parseDate('mm/dd/yy', $('#BeginDate').val());
    var endD = $.datepicker.parseDate('mm/dd/yy', $('#EndDate').val());
    if (begD > endD) {
            alert('Begin date must be before End date');
            $('#BeginDate').focus();
            return false;
    }    

（请参阅此脚本中的上下文： http://jsfiddle.net/clayshannon/QCrXG/9/ ）

(see this script in context here: http://jsfiddle.net/clayshannon/QCrXG/9/)

...用于比较datepicker vals，但我也需要合并时间元素，以便End时间元素中比Begin时间元素更早的时间（在同一天）还将范围标记为无效。

...works for comparing the datepicker vals, but I need to incorporate the time elements too, so that a time (on the same date) that is earlier in the "End" time element than the "Begin" time element will also flag the range as invalid.

如何做到这一点？

推荐答案

这是一种方法。您需要测试以查看日期是否相同，然后在其中，将时间追加到您可以比较的新日期对象。 （可能有更快的方法来实现这一点，但这可以在测试中使用，这里： http://jsfiddle.net / mori57 / SEqVE / ）：

Here's an approach. You need to test to see if the dates are the same, and then inside that, append the times to new date objects that you can then compare. (There might be a faster way to do this, but this works in testing, here: http://jsfiddle.net/mori57/SEqVE/):

} else if(begD.toString() == endD.toString() ){
    var dteString = begD.getFullYear() + "/" + (begD.getMonth()+1) + "/" + begD.getDate();
    var begT = new Date(dteString + " " + $('#BeginTime').val());
    var endT = new Date(dteString + " " + $('#EndTime').val());

    if( begT > endT ){
        alert('Begin date must be before End date');
        $('#BeginTime').focus();
        return false;
    }
}

这篇关于如何使用jQueryUI datepicker和HTML5时间输入比较日期/时间值？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！