2016-11-14 77 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(); 
});