Home > Web Front-end > JS Tutorial > body text

JQuery日历插件My97DatePicker日期范围限制_jquery

WBOY
Release: 2016-05-16 15:19:11
Original
1318 people have browsed it

本文实例向大家介绍了JQuery日历插件My97DatePicker日期范围限制的方法,分享给大家供大家参考,具体内容如下

```

下面重点说明日期范围限制:
1)静态限制
你可以给通过配置minDate(最小日期),maxDate(最大日期)为静态日期值,来限定日期的范围
示例1.1:限制日期的范围是 2012-12-1到2012-12-20

复制代码 代码如下:
```

示例1.2:限制日期的范围是 2012-12-4 21:30:00 到 2012-12-4 23:59:30

复制代码 代码如下:
```

示例1.3:限制日期的范围是 2012年12月 到 2013年12月

复制代码 代码如下:
```

示例1.4:限制时间的范围是 9:00:00 到 18:30:00

复制代码 代码如下:
```

2)动态限制
你可以通过系统给出的动态变量,如%y(当前年),%M(当前月)等来限度日期范围,你还可以通过{}进行表达式运算,如:{%d+1}:表示明天

格式 说明
%y 当前年
%M 当前月
%d 当前日
%ld 本月最后一天
%H 当前时
%m 当前分
%s 当前秒
{} 运算表达式,如:{%d+1}:表示明天

F{} {}之间是函数可写自定义JS代码
示例2.1:只能选择今天以前的日期(包括今天)

复制代码 代码如下:

示例2.2:使用了运算表达式 只能选择今天以后的日期(不包括今天)

复制代码 代码如下:
```

示例2.3:只能选择本月的日期1号至本月最后一天

复制代码 代码如下:
```

示例2.4:只能选择今天7:00:00至明天21:00:00的日期

复制代码 代码如下:
```

示例2.5:使用了运算表达式 只能选择 20小时前 至 30小时后 的日期

复制代码 代码如下:
```

3)脚本自定义限制
系统提供了$dp.$D和$dp.$DV这两个API来辅助你进行日期运算,此外你还可以通过在 #F{} 中填入你自定义的脚本,做任何你想做的日期限制
示例3.1: 前面的日期不能大于后面的日期且两个日期都不能大于 2020-10-01
从 到

```

```

Copy after login

示例3.2:前面的日期+3天 不能大于 后面的日期

```

```

Copy after login

示例3.3:前面的日期+3月零2天 不能大于 后面的日期 且 前面日期都不能大于 2020-4-3减去3月零2天 后面日期 不能大于 2020-4-3



Copy after login

示例3.4:发挥你的JS才能,定义任何你想要的日期限制
自动转到随机生成的一天,当然,此示例没有实际的用途,只是为演示目的



Copy after login

4)无效天限制
可以使用此功能禁用周日至周六所对应的日期,相关属性:disabledDays (0至6 分别代表周日至周六)
示例4.1:禁用 周六 所对应的日期

复制代码 代码如下:
```

禁用 周六 周日 所对应的日期

复制代码 代码如下:
```

5)无效日期限制
可以使用此功能禁用,所指定的一个或多个日期,只要熟悉正则表达式,可以尽情发挥
用法(正则匹配):
如果你熟悉正则表达式,会很容易理解下面的匹配用法
如果不熟悉,可以参考下面的常用示例
['2008-02-01','2008-02-29'] 表示禁用 2008-02-01 和 2008-02-29
['2008-..-01','2008-02-29'] 表示禁用 2008-所有月份-01 和 2008-02-29
['200[0-8]]-02-01','2008-02-29'] 表示禁用 [2000至2008]-02-01 和 2008-02-29
['^2006'] 表示禁用 2006年的所有日期
此外,您还可以使用 %y %M %d %H %m %s 等变量, 用法同动态日期限制 注意:%ld不能使用
['....-..-01','%y-%M-%d'] 表示禁用 所有年份和所有月份的第一天和今天
['%y-%M-{%d-1}','%y-%M-{%d+1}'] 表示禁用 昨天和明天
当然,除了可以限制日期以外,您还可以限制时间
['....-..-.. 10\:00\:00'] 表示禁用 每天10点 (注意 : 需要 使用 \: )
示例5.1:禁用 每个月份的 5日 15日 25日

```

//注意 :'5$' 表示以 5 结尾 注意 $ 的用法

Copy after login

示例5.2:禁用 所有早于2000-01-01的日期

```

//注意:'^19' 表示以 19 开头 注意 ^ 的用法
//当然,可以使用minDate实现类似的功能 这里主要是 在演示 ^ 的用法

Copy after login

示例5.3:配合min/maxDate使用,可以把可选择的日期分隔成多段

复制代码 代码如下:
```

示例5.4:min/maxDate disabledDays disabledDates 配合使用 即使在要求非常苛刻的情况下也能满足需求

复制代码 代码如下:
```

示例5.5:禁用前一个小时和后一个小时内所有时间 使用 %y %M %d %H %m %s 等变量

复制代码 代码如下:
```

示例5.6: #F{}也是可以使用的
本示例利用自定义函数 随机禁用0-23中的任何一个小时
打开小时选择框,你会发现有一个小时被禁用的,而且每次禁用的小时都不同



Copy after login

6)有效日期
使用无效日期可以很方便的禁用不可用的日期,但是在只需要启用少部分日期的情况下,有效日期的功能就非常适合了.
关键属性: opposite 默认为false, 为true时,无效日期变成有效日期,该属性对无效天,特殊天不起作用
示例6.1:只启用 每个月份的 5日 15日 25日

```

//注意 :'5$' 表示以 5 结尾 注意 $ 的用法

Copy after login

7)特殊天和特殊日期
特殊天和特殊日期的用法跟完全无效天和无效日期完全相同,但是opposite属性对其无效
关键属性:
specialDays (0至6 分别代表 周日至周六) 用法同无效天
specialDates 用法同无效日期,但是对时分秒无效
示例7.1:高亮每周 周一 周五

复制代码 代码如下:
```

示例7.2:高亮每月 1号 15号

复制代码 代码如下:
```

以上就是本文的全部内容,希望对大家的学习有所帮助。

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!