2016-11-14 103 views
-4

有人可以幫助我更改代碼,我想讓我的成員在3月至10月(每年)之間選擇一個星期日。 但僅限本月的第2或第4個週日。JQuery Datepicker

感謝您的幫助!

<!doctype html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <title>jQuery UI Datepicker - Default functionality</title> 
 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
 
    <link rel="stylesheet" href="/resources/demos/style.css"> 
 
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
 
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
 

 
    
 
<script type="text/javascript"> 
 
    $(function() { 
 
     $("#datepic").datepicker(
 
     { beforeShowDay: function(day) { 
 
      var day = day.getDay(); 
 
      if (day == 2 || day == 5| day == 4| day == 6| day == 1| day == 3) 
 
{ 
 
       return [false, "somecssclass"] 
 
      } else { 
 
       return [true, "someothercssclass"] 
 
      } 
 
     } 
 
     }); 
 
    }); 
 
</script> 
 
</head> 
 
<body> 
 
<p>Uw voorkeursdatum: <input id="datepic"/> 
 
</body> 
 
</body> 
 
</html>

+1

你應該嘗試,並開始開發和提問,如果您有任何問題或看到錯誤。 –

+0

這個答案應該可以幫助你的方式http://stackoverflow.com/a/9295262/2822450 – developius

+0

我改變了你只能選擇星期日,但現在呢?我想只啓用每個月的第二個和第四個星期天。 – tiresz

回答

0

beforeShowDay選擇是允許第2和第4個週日只待選對了地方。

爲了做到這一點,我使用了兩個「標誌」(用於確定循環內特定狀態的變量)。

每次在循環中遇到星期日時都會觸發一個標誌。
而且一定要考慮當月的週日。

DatePicker正在循環顯示beforeShowDay選項中提供的函數中的每個表格單元格。
即使沒有「呈現」,前幾個月或下一個月的日子也會經過這個循環,即

我還使用了一個100ms的超時重置這些標誌,每月繪製一次。
從一個月到另一個月導航時需要。

以下是在this CodePen中工作的功能。
我留下了一對有用的console.log
;)

$(function() { 
    var even=false; 
    var inCurrentMonth=false; 

    $("#DatePicker").datepicker({ 

     beforeShowDay: function(fulldate) { 
      //console.log(fulldate); 
      var day = fulldate.getDay(); 
      var date = fulldate.getDate(); 

      // In current month when the date 1 is found. 
      if(date==1){ 
       inCurrentMonth=!inCurrentMonth; 
       // To reset values right after month draw. 
       setTimeout(function(){ 
        even=false; 
        inCurrentMonth=false; 
       },100); 
      } 

      // This condition prevents conting syndays frome the previous month. 
      if(inCurrentMonth){ 
       // If NOT a sunday. 
       if (day != 0){ 
        return [false,"Otherdays"] 
       } else { 
        // If this sunday is even (2nd or 4th) 
        if(even){ 
         even=!even; 
         return [true,"Selectable-Sunday","You can select me!"] 
        }else{ 
         even=!even; 
         return [false,"Unselectable-Sunday"] 
        } 
       } 
      } 
     } 
    }).focus(); 
});