近日項目中有做到關於時段的內容，因為是時段需要對於起始時間與結束時間進行判斷，於是就使用了My97DatePicker時間插件(同事推薦，因為看到我自己寫的判斷方法太low)，下面就對My97DatePicker進行簡單了解
首先給出插件網址My97時間控件 
（這是樓主覺得最好看的皮膚）
首先進行簡單配置
（1）下載WdatePicker.js（包括lang和skin文件夾）。
（2）在html頁面中導入WdatePicker.js。
（3）在輸入框input元素上加入class="Wdate" onFocus(或onclick)="WdatePicker({lang:'zh-cn'(等一系列屬性用','分割)})"代碼。
然后就開始我們的使用：
首先這個div中有兩個input框分別為 1.開始時間、2.結束時間
1 <div id="existing" style="margin-top: 10px;margin-bottom: 10px;"> 2 開始時間:<input name="startTime" id="beg${status.index}" type="text" maxlength="20" 3 class="input-medium Wdate" required value="<fmt:formatDate value="${list.startTime}" pattern="HH:mm"/>" 4 onclick="WdatePicker({dateFmt:'HH:mm',isShowClear:true,maxDate:'#F{$dp.$D(\'end${status.index}\')}'});"/> 5 結束時間:<input name="endTime" id="end${status.index}" type="text" maxlength="20" 6 class="input-medium Wdate" required value="<fmt:formatDate value="${list.endTime}" pattern="HH:mm"/>" 7 onclick="WdatePicker({dateFmt:'HH:mm',isShowClear:true,minDate:'#F{$dp.$D(\'beg${status.index}\')}'});"/> 8 <input type="button" onclick="timeManagement(this)" class="btn btn-primary " value="刪除"/> 9</div>
主要說下在WdatePicker內的各屬性意義
1.dateFmt：限定在使用者在點擊這個input框時日期控件是以一種什么格式出現的 HH:mm 就是--時:分(注大寫的HH為24小時制，hh為12小時制),‘yyyy-MM-dd’則為年-月-日 這種形式，有靈活的可調控性
2.isShowClear：是一個清空按鈕，點擊直接清空日期，有這個屬性控件中就會出現
3.maxDate(此屬性用來控制時段)：最大時間
4.minDate(此屬性用來控制時段)：最小時間
這個表達式是關鍵#F{$dp.$D()}:
把他拆分開分為：1.#F{ }、2.$dp.$D( )兩部分
1.#F{ }在{}中可以自定義的js代碼
2.$dp.$D( )：$dp.$相當於document.getElementById函數--獲取id,沒錯就是在起始時間maxDate的$dp.$D( )中寫入結束時間的id就行了！是不是很easy！但是記得id要被----\' \' 框住(注:id必須唯一,我寫的花里胡哨是因為做的動態表單,id要有唯一標識)
更多的時間控制請前往這里繼續深入學習~