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

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

本文主要介绍JQuery日历插件My97DatePicker的日期范围限制的相关信息。有需要的朋友可以参考一下。

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

` ` input class=' Wdate ' id=' D1 ' onclick=' WdatePicker()'/

下面重点介绍日期范围限制:

1)静态限制

您可以通过将minDate(最小日期)和maxDate(最大日期)配置为静态日期值来限制日期范围。

示例1.1:截止日期为2012年12月1日至2012年12月20日。

复制代码如下:` `` ` input class=' wdate ' id=' D2 ' onfocus=' wdate picker({ skin:' why green ',mindate:' 2012 . 12 . 1 ',max date:' 2012 . 12 . 20 ' })'/

示例1.2:限行日期为2012年12月4日21: 30: 00至2012年12月4日23: 59: 30。

复制代码如下:` `` ` input type=' text ' id=' D3 ' class=' wdate ' onfocus=' wdate picker({ skin:' why green ',datefmt:' yyyy-mm-ddhh: mm: ss ',Mindate:' 2012年12月maxDate:' 2012-12-4 23:59:30 ' })' value=' 2012-12-4 21:30:00 '/

示例1.3:限制日期范围为2012年12月至2013年12月。

复制代码如下: ````输入类型=' text ' class=' wdate ' id=' D4 ' onfocus=' wdatepicker({ Date fmt:' yyyy年,m月',Mindate:' 2012年12月',最大日期:' 2013年12月' })'。

示例1.4:时限范围为9:00:00至18:30:00。

复制代码如下:` `` ` input class=' wdate ' id=' D5 ' onfocus=' wdate picker({ Date fmt:' H:MM:SS ',Mindate:' 9: 00: 00 ',Max Date:' 18: 30: 00'})'/

2)动态限制

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

正式描述/规格

%y当前年度

%M当前月份

当前第%d天

本月的最后一天%ld

%H当前时态

%m当前分数

%s当前秒

{}表达式,如{%d 1}:明天

F{} {}之间是函数可写的自定义JS代码

示例2.1:您只能选择今天(包括今天)之前的日期。

复制代码如下:input id=' d421 ' class=' wdate ' type=' text ' onfocus=' wdate picker({ skin:' why green ',max date:'% y-%m-%d'})'/

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

复制代码如下: ````输入id=' d422 ' class=' wdate ' type=' text ' onfocus=' wdate选取器({mindate:'% y-%m-{%d1}'})'/

示例2.3:您只能选择从本月1日到本月最后一天。

复制代码如下: ````输入id=' d423 ' class=' wdate ' type=' text ' onfocus=' wdate选取器({Mindate:'% y-%m-01 ',最大日期:' % y-%m-%LD'})'/

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

复制代码如下: ````输入id=' d424 ' class=' wdate ' type=' text ' onfocus=' wdate选取器({datefmt:' yyyy-m-d h: mm: ss ',mindate:'% y-%m-%d 7: 00

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

复制代码如下: ````输入id=' d425 ' class=' wdate ' type=' text ' onclick=' wdate选取器({datefmt:' yyyy-mm-ddhh: mm ',mindate:'% y-%m-%d {%h-20 ')

3)脚本自定义限制

系统提供了两个API,$dp。$D和$dp。$DV,帮助你计算日期。此外,您可以在#F{}中填写您的自定义脚本,并根据需要设置任何日期限制。

示例3.1:之前的日期不能晚于示例3.2:之后的日期,并且两个日期都不能晚于2020年10月1日。

从什么到什么

` ` input id=' d 4311 ' class=' Wdate ' type=' text ' onFocus=' WdatePicker({ maxDate:' # F { $ DP。$ D(\ ' D 4312 \ ')| | \ ' 2020-10-01 \ ' } ' })'/

` ` input id=' d 4312 ' class=' Wdate ' type=' text ' onFocus=' WdatePicker({ minDate:# F { $ DP。$D(\'d4311\')} ',maxDate:'2020-10-01'})'/

示例3.3:3天之前的日期不能晚于3天之后的日期。

` ` input type=' text ' class=' Wdate ' id=' d 4321 ' onFocus=' WdatePicker({ maxDate:# F { $ DP。$D(\'d4322\ ',{ D:-3 });}'})'/

` ` input type=' text ' class=' Wdate ' id=' d 4322 ' onFocus=' WdatePicker({ minDate:# F { $ DP。$D(\'d4321\ ',{ D:3 });}'})'/

示例3.4:之前的日期02年3月不能大于之后的日期,之前的日期不能大于2020年4月3日减去02年3月,以及2020年4月3日之后的日期。

input type=' text ' class=' Wdate ' id=' d 4331 ' onFocus=' WdatePicker({ maxDate:' # F { $ DP。$D(\'d4332\ ',{M:-3,d:-2})||$dp。$DV(\'2020-4-3\ ',{M:-3,d:-2})}'})'/

input type=' text ' class=' Wdate ' id=' d 4332 ' onFocus=' WdatePicker({ minDate:' # F { $ DP。$D(\'d4331\ ',{M:3,D:2 });} ',maxDate:'2020-4-3'})'/

4)无效天限制发挥你的JS天赋,任意定义你想要的日期限制。

自动转到随机生成的日期。当然,这个例子没有实际用途,只是为了演示。

脚本

//返回一个随机日期

函数randomDate(){

var Y=2000 math . round(math . random()* 10);

var M=1 math . round(math . random()* 11);

var D=1 math . round(math . random()* 27);

返回Y '-' M '-' D;

}

/脚本

input type=' text ' class=' Wdate ' id=' d434 ' onFocus=' var date=random date();WdatePicker({minDate:date,maxDate:date})'/

示例4.1:

您可以使用此功能禁用周日至周六对应的日期。相关属性:disabledDays (0到6分别表示周日到周六)

['2008-02-01','2008-02-29']禁用对应于星期六的日期

复制代码如下:` ` ` ` input id=' d441 ' type=' text ' class=' wdate ' onfocus=' wdate picker({ disabled days:[6]})'/

禁用周六和周日对应的日期。

复制代码如下:` `` ` input id=' d442 ' type=' text ' class=' wdate ' onfocus=' wdate picker({ disabled days:[0,6]})'/

5)无效的日期限制

您可以使用此功能禁用指定的日期。只要熟悉正则表达式,就可以充分利用。

用法(常规匹配):

如果你熟悉正则表达式,你很容易理解下面的匹配用法。

如果不熟悉,可以参考以下常见的例子。

['2008-..-01','2008-02-29'] 表示禁用2008-02-01和2008-02-29。

['200[0-8]]-02-01','2008-02-29']表示2008-所有月份-01和2008-02-29被禁用。

['^2006'] 表示[2000到2008]-02-01和2008-02-29被禁用。

['....-..-01','%y-%M-%d'] 表示禁用2006年的所有日期。

此外,还可以使用%y %M %d %H %m %s等变量,其用法与动态日期限制相同。注意:不能使用%ld。

['%y-%M-{%d-1}','%y-%M-{%d+1}']表示禁用所有年份和月份的第一天和今天。

['....-..-.. 10\:00\:00'] 表示昨天和明天禁用。

当然,你可以限制时间和日期。

示例5.1:表示每天10: 00禁用(注意:需要使用\:)

示例5.2:每月5日、15日、25日禁用。

` ` input id=' d451 ' type=' text ' class=' Wdate ' onFocus=' WdatePicker({ disabled dates:[' 5 $ ']})'/

//注意:‘5 $’表示以5结尾。注意$的用法

示例5.3:禁用2000-01-01之前的所有日期

``输入id=' d452 ' type=' text ' class=' wdate ' onfocus='wdatepicker({disableddates:['^19']})'/

//注意:‘19’表示从19开始。注意…的用法。

//当然也可以用minDate实现类似的功能。这主要是为了演示的用法

示例5.4:与min/maxDate配合使用,可以将可选日期分成多个段。

复制代码如下: ````输入id=' d453 ' type=' text ' class=' wdate ' onfocus=' wdate选取器({mindate:'% y-%m-01 ',maxdate:'% y-%m-%LD ',禁用日期:[

示例5.5:最小/最大禁用日期禁用日期即使在非常苛刻的条件下也能满足需求。

复制代码如下: ````输入id=' d454 ' type=' text ' class=' wdate ' onfocus=' wdate选取器({mindate:'% y-%m-01 ',maxdate:'% y-%m-%LD ',禁用日期:[

示例5.6:在前一个小时和后一个小时内,始终禁用变量,如%y %M %d %H %m %s。

复制代码如下: ````输入id=' d2a 25 ' type=' text ' class=' wdate ' onfocus=' wdate picker({ date fmt:' yyyy-mm-DD HH:mm:ss ',禁用日期:['%y-%m-%d {

示例6.1:# f {}也可以。

此示例使用自定义函数随机禁用0到23之间的任意小时。

打开小时选择框,你会发现禁用了一个小时,而且每次禁用的小时都不一样。

脚本

函数randomH(){

//生成一个0-23的随机数

var H=math . round(math . random()* 23);

if(H10)H=' 0 ' H;

//返回数字''

返回'^' h;

}

/脚本

input type=' text ' class=' Wdate ' id=' d456 ' onFocus=' WdatePicker({ date fmt:' HH:mm:ss ',disabled dates:[' # F { randomH()} ']})'/

6)生效日期

使用无效日期可以方便地禁用不可用日期,但是当只需要启用少数日期时,有效日期的功能就非常合适了。

关键属性:对立的默认值为false。如果为真,无效日期将成为生效日期。该属性对无效日期和特殊日期没有影响。

示例7.1:仅每月5日、15日和25日启用。

` ` input id=' d46 ' type=' text ' class=' Wdate ' onFocus=' WdatePicker({ opposite:true,disabledDates:['5$']})'/

//注意:‘5 $’表示以5结尾。注意$的用法

7)特殊日子和特殊日期

特殊日和特殊日的用法与完全无效日和无效日完全相同,只是相反的属性对它们无效。

关键属性:

特殊日期(0到6分别代表星期日到星期六)与无效日期相同。

特殊日期的用法与无效日期相同,但对时间、分钟和秒无效。

示例7.2:每周一和周五突出显示

复制代码如下:` `` ` input id=' d471 ' type=' text ' class=' wdate ' onfocus=' wdate picker({特殊日子:[1,5]})'/

010-59000突出显示每月的1号和15号。

复制代码如下:` ` `` input id=' d472 ' type=' text ' class=' wdate ' onfocus=' wdate picker({特殊日期:['.-.-01',' .-.-15']})'/

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

郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。

相关文章阅读

  • 使用jquery实现图片轮播效果如何,jQuery图片轮播
  • 使用jquery实现图片轮播效果如何,jQuery图片轮播,使用jQuery实现图片轮播效果
  • 举例说明jquery中each函数的使用,jquery each()
  • 举例说明jquery中each函数的使用,jquery each(),JQuery中each()的使用方法说明
  • 一篇文章带你了解jquery动画人物,一篇文章带你了解jquery动画制作
  • 一篇文章带你了解jquery动画人物,jquery的动画,一篇文章带你了解jQuery动画
  • trigger的用法总结,jquery trigger 传参数
  • trigger的用法总结,jquery trigger 传参数,jQuery中值得注意的trigger方法浅析
  • js hover 触发事件显示另一元素,js hover 触发事件,jQuery中多个元素的Hover事件解决方案
  • js apply 实现原理,jquery apply用法_1
  • js apply 实现原理,jquery apply用法
  • js apply 实现原理,jquery apply用法,js中apply方法的使用详细解析
  • js apply 实现原理,jquery apply用法,JS中apply()的应用实例分析
  • jq获取radio选中的值,jquery radio 取值
  • jq获取radio选中的值,jquery radio 取值,Jquery获取radio选中值实例总结
  • 留言与评论(共有 条评论)
       
    验证码: