使用my97datepicker控件实现日期范围选择

最新推荐文章于 2023-11-16 19:31:52 发布

weixin_30737363

最新推荐文章于 2023-11-16 19:31:52 发布

阅读量94

点赞数

文章标签： javascript xhtml ViewUI

原文链接：http://www.cnblogs.com/coding-man/p/4097464.html

版权

注：（2014-12-05内容修改：添加运行效果）

使用my97datepicker 控件，需要对日期的范围进行控制，本人自己写了一个js完成此功能，示例为当前日期到下一周周五之间的日期可选，其他日期不可选，运行效果图如下(自己点，吼吼)：

代码如下：

 1 <html xmlns="http://www.w3.org/1999/xhtml">
 2 <head runat="server">
 3 <title></title>
 4 <script type="text/javascript" src="My97DatePicker/WdatePicker.js"></script>
 5 <link type="text/css" rel="Stylesheet" href="My97DatePicker/skin/WdatePicker.css" />
 6 <script type="text/javascript">
 7     function getNextFriday() {
 8         var myDate = new Date();
 9         var year = myDate.getFullYear(); //得到当前年份
10         var month = myDate.getMonth() + 1; //得到当前月份
11         var day = myDate.getDate(); //得到当前日
12         var weekDay = myDate.getDay(); //得到当前的星期X（0-6代表星期日-星期六）
13         var maxDayOfMonth = new Date(year, month, 0).getDate(); //得到当前月最大日
14  
15         var nextFriday;//距离下周五的天数
16 
17         switch (weekDay) {
18             case 0:
19                 nextFriday = 5;
20                 break;
21             case 1:
22                 nextFriday = 11;
23                 break;
24             case 2:
25                 nextFriday = 10;
26                 break;
27             case 3:
28                 nextFriday = 9;
29                 break;
30             case 4:
31                 nextFriday = 8;
32                 break;
33             case 5:
34                 nextFriday = 7;
35                 break;
36             case 6:
37                 nextFriday = 6;
38                 break;
39             default:
40                 nextFriday = 1;
41                 break;
42         }
43 
44         var dayTotal = day + nextFriday;
45 
46         /**
47           * 1、如果当前日期到下周五所在的日期在当月，即下周五的日期未跨年也为跨月
48           * 2、跨月，且并未跨年
49           * 3、跨年
50          **/
51         if (dayTotal < maxDayOfMonth) {
52             if (month < 10) {
53                 month = "0" + month;
54             }
55             if (dayTotal < 10) {
56                 dayTotal = "0" + dayTotal;
57             }
58             return year + "-" + month + "-" + dayTotal;
59         } else if (month < 12) {
60             month += 1;
61             if (month < 10) {
62                 month = "0" + month;
63             }
64             var nextMonthDay = nextFriday - (maxDayOfMonth - day);
65             if (nextMonthDay < 10) {
66                 nextMonthDay = "0" + nextMonthDay;
67             }
68             return year + "-" + month + "-" + nextMonthDay;
69             } else {
70                 year += 1;
71                 month = "01";
72                 var nextMonthDay = nextFriday - (maxDayOfMonth - day);
73                 if (nextMonthDay < 10) {
74                     nextMonthDay = "0" + nextMonthDay;
75                 }
76                 return year + "-" + month + "-" + nextMonthDay;
77             }
78     }
79 </script>
80 </head>
81 <body>
82     <form id="form1" runat="server">
83         <input id="DateText" type="text" class="Wdate" οnclick="var friday=getNextFriday();WdatePicker({minDate:'%y-%M-%d',maxDate:friday})" />
84     </form>
85 </body>
86 </html>