0

Basically I have two text boxes where you can select the 'hour' 00-23 and 'minute' in multiples of 5.

What I am trying to achieve is validation so that you can't make a booking within 2 hours of the current date/time. So if the time is now 14:00 and I try to make a booking for 15:30, it will show an alert message. If it's after two hours e.g. 16:00 then it's okay.

I just don't any idea how I can achieve this is jQuery since the time value 2 hours greater that 23:00 is 01:00.

Any help on this would be much appreciated.

Here is the HTML code:-

<div class="div-jtime-content div-content left div-subrow-style ui-corner-all">

    <label for="txt-outbound-date" class="left p-input-label" >Date: </label>

    <input type="text" id="txt-outbound-date" name="txt-outbound-date" class="input-txt-sml left required" />

    <label class="left p-input-label">Time: </label>

    <select name="sel-outbound-hour" id="sel-outbound-hour" class="required input-select">

        <option value="" selected="selected"></option>

        <option value="00">00</option>

        <option value="01">01</option>

        <option value="02">02</option>

        <option value="03">03</option>

        <option value="04">04</option>

        <option value="05">05</option>

        <option value="06">06</option>

        <option value="07">07</option>

        <option value="08">08</option>

        <option value="09">09</option>

        <option value="10">10</option>

        <option value="11">11</option>

        <option value="12">12</option>

        <option value="13">13</option>

        <option value="14">14</option>

        <option value="15">15</option>

        <option value="16">16</option>

        <option value="17">17</option>

        <option value="18">18</option>

        <option value="19">19</option>

        <option value="20">20</option>

        <option value="21">21</option>

        <option value="22">22</option>

        <option value="23">23</option>

    </select>

    <select name="sel-outbound-min" id="sel-outbound-min" class="required input-select">

        <option value="" selected="selected"></option>

        <option value="00">00</option>

        <option value="05">05</option>

        <option value="10">10</option>

        <option value="15">15</option>

        <option value="20">20</option>

        <option value="25">25</option>

        <option value="30">30</option>

        <option value="35">35</option>

        <option value="40">40</option>

        <option value="45">45</option>

        <option value="50">50</option>

        <option value="55">55</option>

    </select>

</div>
4

1 回答 1

2

What you are going to do can easily be done using a Date object comparison. If you would like two hours exactly, the following will prove worthwhile:

function findTS() {
   var ts = new Date();
   ts.setHours($("#sel-outbound-hour").val());
   ts.setMinutes($("#sel-outbound-min").val());
   return ts;
}
function isInTwoHourDelay(ts) {
   var current = new Date();
   if ((current.getTime() - ts.getTime()) > 7200000) return false;
   return true; 
}

The first function converts your time into a Date object. Please note that you need to add sanitization in this - it merely contains the important bits.

The second function compares the current time to a given TS, where getTime returns milliseconds since the unix epoch for a given TS. So, 2 hours is 7200 seconds, so 7200000 millisecs.

于 2013-05-15T13:37:31.610 回答