WdatePicker-限制日期選擇

場景：

1. 開始時間,和結束時間最大選擇今天。

2. 開始時間和結束時間的最大時間間隔為30天。

jsp代碼：

<!-- 時間段 -->
<form>
    <!-- 開始時間格式規則直接綁定在input上 -->
    開始時間：
    <input type="text" style="line-height: 12px;" id="start_time_id" readonly="readonly" class="Wdate"
    name="start_time_name" onClick="WdatePicker({readOnly:true,dateFmt:'yyyy-MM-dd ',maxDate:'#F{$dp.$D(\'end_time_id\')||\'%y-%M-%d\'}',minDate:'#F{$dp.$D(\'end_time_id\',{d:-29})}'})" 
    onchange="setEndTimeDurationWhileStartTimeChange();"/>
    
    <!-- 結束時間格式規則在js中進行及時調整 -->
    結束時間：
    <input type="text" style="line-height: 12px;" id="end_time_id" class="Wdate" name="end_time_name" readonly="readonly"/>
</form>

js代碼：

// 結束時間：初始默認最大日期為今天
$(function(){
    // 設置結束時間的最大可取值為today
    $('#end_time_id').unbind("click");
    $('#end_time_id').bind("click",function(){
        WdatePicker({
            readOnly:true,
            dateFmt:'yyyy-MM-dd ',
            minDate:'#F{$dp.$D(\'start_time_id\')}',
            maxDate:'#F{\'%y-%M-%d\'}'
        });
    });
});

// 開始時間值改變時,改變結束時間值得范圍
function setEndTimeDurationWhileStartTimeChange(){
    var start = $('#start_time_id').val(); // 格式：2017-05-01 
    
    // 如果選中了開始時間
    if(start != "" && start != null){
        // endMaxDate = 開始時間+29天
        start = start.replace(/-/g,"/");
        var endMaxDate = new Date(start);
        endMaxDate.setDate(endMaxDate.getDate()+29); 
        
        // today = 今天
        var today = new Date();
        today.setHours(0);    
        today.setMinutes(0);    
        today.setSeconds(0);    
        today.setMilliseconds(0);
        
        // 如果endMaxDate>today
        if(endMaxDate.getTime()>today.getTime()){
            // 設置結束時間的最大可取值為today
            $('#end_time_id').unbind("click");
            $('#end_time_id').bind("click",function(){
                WdatePicker({
                    readOnly:true,
                    dateFmt:'yyyy-MM-dd ',
                    minDate:'#F{$dp.$D(\'start_time_id\')}',
                    maxDate:'#F{\'%y-%M-%d\'}'
                });
            });
        }else{
            // 設置結束時間的最大可取值為endMaxDate
            $('#end_time_id').unbind("click");
            $('#end_time_id').bind("click",function(){
                WdatePicker({
                    readOnly:true,
                    dateFmt:'yyyy-MM-dd ',
                    minDate:'#F{$dp.$D(\'start_time_id\')}',
                    maxDate:'#F{$dp.$D(\'start_time_id\',{d:29})}'
                });
            });
        }
    }
    // 如果清空了開始時間,重設結束時間的范圍,到今天為止
    else{
        // 設置結束時間的最大可取值為today
        $('#end_time_id').unbind("click");
        $('#end_time_id').bind("click",function(){
            WdatePicker({
                readOnly:true,
                dateFmt:'yyyy-MM-dd ',
                minDate:'#F{$dp.$D(\'start_time_id\')}',
                maxDate:'#F{\'%y-%M-%d\'}'
            });
        });
    }
}