My97DatePicker日期范围限制

文章来源:https://blog.csdn.net/wp1603710463/article/details/50835724

1.动态时间范围限制:

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


动态变量.png

1)只能选择今天以前的日期(包含今天)。

<input type="text" class="Wdate" id="occurDate" onfocus="WdatePicker({skin:'whyGreen',dateFmt: 'yyyy-MM-dd', maxDate:'%y-%M-%d', readOnly:true})" value = "${occurdate}" style="background-color:#e4e4e4;; height:65%; width:100%"></input>

2) 只能选择今天以后的日期(不包含今天),使用运算表达式。

<input type="text" class="Wdate" id="occurDate" onfocus="WdatePicker({skin:'whyGreen',dateFmt: 'yyyy-MM-dd', minDate:'%y-%M-{%d+1}', readOnly:true})" value = "${occurdate}" style="background-color:#e4e4e4;; height:65%; width:100%"></input>

3) 只能选择本月日期1号到本月最后一天的日期。

<input type="text" class="Wdate" id="occurDate" onfocus="WdatePicker({skin:'whyGreen',dateFmt: 'yyyy-MM-dd', minDate:'%y-%M-01',maxDate:'%y-%M-%ld', readOnly:true})" value = "${occurdate}" style="background-color:#e4e4e4;; height:65%; width:100%"></input>

4) 只能选择今天8:00:00至明天12:00:00的日期。

<input id="occurDate" class="Wdate" type="text" onfocus="WdatePicker({dateFmt:'yyyy-M-d H:mm:ss',minDate:'%y-%M-%d 8:00:00',maxDate:'%y-%M-{%d+1} 12:00:00'})"/>

5) 只能选择10小时前至50小时后的日期。

<input id="occurDate" class="Wdate" type="text" onClick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm',minDate:'%y-%M-%d {%H-10}:%m:%s',maxDate:'%y-%M-%d {%H+50}:%m:%s'})"/>

2.脚本自定义限制:

系统提供了dp.D和dp.DV这两个API来辅助进行日期运算,此外还可以通过在 #F{} 中填入自定义的脚本,做任何你想做的日期限制 。

1) 前面的日期不能大于后面的日期且两个日期都不能大于当前年的最后一天。

<input id="date1" class="Wdate" type="text" onFocus="WdatePicker({maxDate:'#F{dp.D('date2')||''%y-12-31'}'})"/>
<input id="date2" class="Wdate" type="text" onFocus="WdatePicker({minDate:'#F{dp.D('date1')}',maxDate:'%y-12-31'})"/>

2) 前面的日期+5天,不能大于后面的日期。

<input id="date1" type="text" class="Wdate" onFocus="WdatePicker({maxDate:'#F{dp.D('date2',{d:-5});}'})"/>
<input id="date2" type="text" class="Wdate" onFocus="WdatePicker({minDate:'#F{dp.D('date1',{d:5});}'})"/>

3) 前面的日期+2月零6天,不能大于后面的日期且前面日期都不能大于 2020-6-6减去2月零6天,后面日期不能大于2020-6-6。

<input id="date1" type="text" class="Wdate" onFocus="WdatePicker({maxDate:'#F{dp.D('date2',{M:-2,d:-6})||dp.DV('2020-6-6',{M:-2,d:-6})}'})"/>
<input id="d4332" type="text" class="Wdate" onFocus="WdatePicker({minDate:'#F{dp.D('date1',{M:2,d:6});}',maxDate:'2020-6-6'})"/>

3.无效天限制:

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

<input id="date1" type="text" class="Wdate" onFocus="WdatePicker({disabledDays:[6]})"/>

2) 禁用周六,周日所对应的日期。

<input id="date2" type="text" class="Wdate" onFocus="WdatePicker({disabledDays:[0,6]})"/>

4.无效日期限制:

1)可以使用此功能禁用所指定的一个或多个日期,只要熟悉正则表达式。

  用法(正则匹配):  如果你熟悉正则表达式,会很容易理解下面的匹配用法;如果不熟悉,可以参考下面的常用示例 :

  ['2010-01-01','2010-02-02'] 表示禁用 2010-01-01 和 2010-02-02。
  ['2010-..-01','2010-02-02'] 表示禁用 2010-所有月份-01 和 2010-02-02。
  ['200[0-9]]-02-01','2010-02-10'] 表示禁用 [2000至2009]-02-01 和 2010-02-10。
  ['^2010'] 表示禁用 2010年的所有日期。

  此外,还可以使用 %y %M %d %H %m %s 等变量,用法同动态日期限制。注意:%ld不能使用。
  ['....-..-01','%y-%M-%d'] 表示禁用所有年份和所有月份的第一天和今天。
  ['%y-%M-{%d-1}','%y-%M-{%d+1}'] 表示禁用昨天和明天。

  当然,除了可以限制日期以外,还可以限制时间:
  ['....-..-.. 11\:00\:00'] 表示禁用每天11点 (注意 : 需要使用 \: ) 。

2) 禁用每个月份的5日15日25日。

<input id="date1" type="text" class="Wdate" onFocus="WdatePicker({disabledDates:['5$']})"/>

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

3)禁用所有早于2000-01-01的日期。

<input id="date1" type="text" class="Wdate" onFocus="WdatePicker({disabledDates:['^19']})"/>

 注意: '^19' 表示以19 开头,注意 ^ 的用法 。

4)配合min/maxDate使用,可以把可选择的日期分隔成多段。

<input id="date3" type="text" class="Wdate" onFocus="WdatePicker({minDate:'%y-%M-01',maxDate:'%y-%M-%ld',disabledDates:['0[4-7]','1[1-5]','2[58]$']})"/>

5) min/maxDate disabledDays disabledDates 配合使用,即使在要求非常苛刻的情况下也能满足需求。

<input id="date4" type="text" class="Wdate" onFocus="WdatePicker({minDate:'%y-%M-01',maxDate:'%y-%M-%ld',disabledDates:['0[4-7]','1[1-5]','2[58]$'],disabledDays:[1,3,6]})"/>

6) 禁用前一个小时和后一个小时内所有时间,使用 %y %M %d %H %m %s 等变量。

<input id="date5" type="text" class="Wdate" onFocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',disabledDates:['%y-%M-%d {%H-1}:..:..','%y-%M-%d {%H+1}:..:..']})"/>

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

<script>
function randomH(){
//产生一个随机的数字 0-23
var H = Math.round(Math.random() * 23);
if(H<10) H='0'+H;
//返回 '^' + 数字
return '^'+H;
}
</script>

<input type="text" class="Wdate" id="date5" onFocus="WdatePicker({dateFmt:'HH:mm:ss',disabledDates:['#F{randomH()}']})"/>

5.有效日期:

使用无效日期可以很方便的禁用不可用的日期,但是在只需要启用少部分日期的情况下,有效日期的功能就非常适合了。

关键属性: opposite 默认为false, 为true时,无效日期变成有效日期,该属性对无效天,特殊天不起作用 。

1) 只启用每个月份的 5日 15日 25日。

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

6.特殊天和特殊日期:

特殊天和特殊日期的用法跟完全无效天和无效日期完全相同,但是opposite属性对其无效。

关键属性:

   specialDays (0至6 分别代表 周日至周六) 用法同无效天。

   specialDates 用法同无效日期,但是对时分秒无效。

1) 高亮每周 周一 周五。

<input id="date1" type="text" class="Wdate" onFocus="WdatePicker({specialDays:[1,5]})"/>

2) 高亮每月 1号 15号。

<input id="date2" type="text" class="Wdate"
onFocus="WdatePicker({specialDates:['....-..-01','....-..-15']})"/>

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 202,905评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,140评论 2 379
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 149,791评论 0 335
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,483评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,476评论 5 364
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,516评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,905评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,560评论 0 256
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,778评论 1 296
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,557评论 2 319
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,635评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,338评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,925评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,898评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,142评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,818评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,347评论 2 342

推荐阅读更多精彩内容