日期時間插件WdatePicker.js使用方法

日期時間插件WdatePicker.js使用方法
官網：http://www.my97.net/demo/index.htm

支持瀏覽器

IE 6.0+ , Firefox 2.0+ , Chrome, Opera 9.5+ , Safari 3.0+

HTML

<!-- 類名"Wdate"顯示日期小圖標-->
<input id="select-time" class="Wdate" />

JavaScript

$("#select-time").click(function () {
      WdatePicker({
          el: this, //點擊對象id，一般可省略el
          lang: 'auto', //語言選擇，一般用auto
          dateFmt: 'yyyy-MM-dd HH:mm:ss', //時間顯示格式，年月日 時分秒，年月日就是yyyy-MM-dd
          minDate: '#F{$dp.$D(\'inputstarttime\')}', //最小日期
          maxDate: '%y-%M-%d', //最大日期（當前時間）
          readOnly: true, //是否只讀
          isShowClear: true, //是否顯示“清空”按鈕
          isShowOK: true, //是否顯示“確定”按鈕
          isShowToday: true, //是否顯示“今天”按鈕
          autoPickDate: true //為false時 點日期的時候不自動輸入,而是要通過確定才能輸入，為true時 即點擊日期即可返回日期值，為null時(推薦使用) 如果有時間置為false 否則置為true
      })
  })

一個時間段選擇的栗子：后面的日期不能小於前面的日期 

HTML

<input id="select-start-time" class="Wdate" /> 至 <input id="select-end-time" class="Wdate" />

JavaScript

$("#select-start-time").click(function () {
        WdatePicker({
            lang: 'auto',
            dateFmt: 'yyyy-MM-dd',
            maxDate: '#F{$dp.$D(\'select-end-time\')||\'%y-%M-%d\'}',
            readOnly: true
        })
    })
    $("#select-end-time").click(function () {
        WdatePicker({
            lang: 'auto',
            dateFmt: 'yyyy-MM-dd',
            minDate: '#F{$dp.$D(\'select-start-time\')}',
            maxDate: '%y-%M-%d',
            readOnly: true
        })
    })

 或

                            <div class="form-group row">
                                <label
                                    class="col-sm-2 col-md-2 col-lg-2 col-xl-2 control-label font-normal align-right">開始時間：</label>
                                <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
                                    <input type="input" class="Wdate form-control" id="log-modal-start-time"
                                        style="height: 34px; background-color: #ffffff;" name="logModalStartTime"
                                        onClick="WdatePicker({maxDate:'#F{$dp.$D(\'log-modal-end-time\')}'});"
                                        readonly="readonly" />
                                </div>
                                <label class="col-sm-2 col-md-2 col-lg-2 col-xl-2 control-label font-normal align-right"
                                    style="width: 130px;">結束時間：</label>
                                <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
                                    <input type="input" class="Wdate form-control" id="log-modal-end-time"
                                        style="height: 34px; background-color: #ffffff;" name="logModalEndTime"
                                        onClick="WdatePicker({minDate:'#F{$dp.$D(\'log-modal-start-time\')}'}); "
                                        readonly="readonly" />
                                </div>
                            </div>