jQuery Datepicker minDate佔一天中的時間

我在我的網站上使用Jquery datepicker以便客戶選擇期望的交付日期。目前，我已經設置了4天的分鐘日期，不包括週末或節假日。我只是意識到我需要考慮一天中的時間，以便如果某人在下午2點後下訂單，那麼它不會在該日期的那一天計算（因爲出貨時間太晚）。jQuery Datepicker minDate佔一天中的時間

我能找到幾個帖子吧，一個特別適用看來：

How do I restrict dates on datepicker after a certain time

不過，我在將其應用到我的當前腳本（下）一個嚴重困難的時候。如果有人能告訴我如何適應這一點，那將是非常酷的。

非常感謝您的時間和幫助！〜蘇珊

<script type="text/javascript"> 
    $(document).ready(function() { 

    //holidays 
    var natDays = [ 
    [1, 1, 'uk'], 
    [12, 25, 'uk'], 
    [12, 26, 'uk'] 
    ]; 

    var dateMin = new Date(); 
    var weekDays = AddBusinessDays(4); 

    dateMin.setDate(dateMin.getDate() + weekDays); 

    function AddBusinessDays(weekDaysToAdd) { 
    var curdate = new Date(); 
    var realDaysToAdd = 0; 
    while (weekDaysToAdd > 0){ 
     curdate.setDate(curdate.getDate()+1); 
     realDaysToAdd++; 
     //check if current day is business day 
     if (noWeekendsOrHolidays(curdate)[0]) { 
     weekDaysToAdd--; 
     } 
    } 
    return realDaysToAdd; 

    } 

    function noWeekendsOrHolidays(date) { 
     var noWeekend = $.datepicker.noWeekends(date); 
     if (noWeekend[0]) { 
      return nationalDays(date); 
     } else { 
      return noWeekend; 
     } 
    } 
    function nationalDays(date) { 
     for (i = 0; i < natDays.length; i++) { 
      if (date.getMonth() == natDays[i][0] - 1 && date.getDate() == natDays[i][1]) { 
       return [false, natDays[i][2] + '_day']; 
      } 
     } 
     return [true, '']; 
    } 
    $('#datepicker').datepicker({ 
     inline: true, 
     beforeShowDay: noWeekendsOrHolidays,   
     showOn: "both",    
     firstDay: 0, 
     dateformat: "dd/mm/yy", 
     changeFirstDay: false, 
     showButtonPanel: true,  
     minDate: dateMin    
    }); 
}); 
</script> 

<p> 
<label for="datepicker">Desired Delivery Date: </label> 
    <input class="input-medium" type="text" id="datepicker" placeholder="ex. 01/01/2013" name="properties[Delivery Date]" readonly /> 
    <label><font size=1>Need it faster? Please call us! (800) 880-0307</font> 
    </label></p> 
<style> 
    #datepicker { height: 20px; } 
    #datepicker {-webkit-border-radius: 0 3px 3px 0; -moz-border-radius: 0 3px 3px 0; border-radius: 0 3px 3px 0;} 
</style>

來源

2013-09-24 susan

我終於解決了這個問題，所以我發佈了一個答案，我自己的問題。希望它能幫助別人。以下是完整的代碼，不包括美國國家法定節假日和週末的4天的分鐘日期，以及如果在下午2點以後將MinDate調整爲排除當前日期的情況。

<script type="text/javascript"> 
    $(document).ready(function() { 

    //holidays 
    var natDays = [ 
     [1, 1, 'New Year'], //2014 
     [1, 20, 'Martin Luther King'], //2014 
     [2, 17, 'Washingtons Birthday'], //2014  
     [5, 26, 'Memorial Day'], //2014 
     [7, 4, 'Independence Day'], //2014 
     [9, 1, 'Labour Day'], //2014 
     [10, 14, 'Columbus Day'], //2013 
     [11, 11, 'Veterans Day'], //2013 
     [11, 28, 'Thanks Giving Day'], //2013 
     [12, 25, 'Christmas'] //2013  
]; 

    var dateMin = new Date(); 
    dateMin.setDate(dateMin.getDate() + (dateMin.getHours() >= 14 ? 1 : 0)); 
    AddBusinessDays(dateMin, 4); 

    function AddBusinessDays(curdate, weekDaysToAdd) { 
     while (weekDaysToAdd > 0) { 
      curdate.setDate(curdate.getDate() + 1); 
      //check if current day is business day 
      if (noWeekendsOrHolidays(curdate)[0]) { 
       weekDaysToAdd--; 
      } 
     } 
    }  

    function noWeekendsOrHolidays(date) { 
     var noWeekend = $.datepicker.noWeekends(date); 
     if (noWeekend[0]) { 
      return nationalDays(date); 
     } else { 
      return noWeekend; 
     } 
    } 
    function nationalDays(date) { 
     for (i = 0; i < natDays.length; i++) { 
      if (date.getMonth() == natDays[i][0] - 1 && date.getDate() == natDays[i][1]) { 
       return [false, natDays[i][2] + '_day']; 
      } 
     } 
     return [true, '']; 
    } 
     $('#datepicker').datepicker({ 
      inline: true, 
      beforeShowDay: noWeekendsOrHolidays,   
      showOn: "both",    
      firstDay: 0, 
      dateformat: "dd/mm/yy", 
      changeFirstDay: false, 
      showButtonPanel: true,  
      minDate: dateMin    
    }); 
    }); 
    </script> 

<p> 
<label for="datepicker">Desired Delivery Date: </label> 
    <input class="input-medium" type="text" id="datepicker" placeholder="ex. 01/01/2013" name="properties[Delivery Date]" readonly /> 
    <label><font size=1>Need it faster? Please call us! (800) 880-0307</font> 
    </label></p> 
<style> 
    #datepicker { height: 20px; } 
    #datepicker {-webkit-border-radius: 0 3px 3px 0; -moz-border-radius: 0 3px 3px 0; border-radius: 0 3px 3px 0;} 
</style>

來源

2013-09-26 00:52:03 susan

jQuery Datepicker minDate佔一天中的時間

回答

相關問題