My97DatePicker日期范围限制
1.动态时间范围限制:
可以通过系统给出的动态变量,如%y(当前年),%M(当前月)等来限制日期范围,还可以通过{}进行表达式运算,如:{%d+1}:表示明天。
| 格式 | 说明 |
| %y | 当前年 |
| %M | 当前月 |
| %d | 当前日 |
| %ld | 本月最后一天 |
| %H | 当前时 |
| %m | 当前分 |
| %s | 当前秒 |
| {} | 运算表达式, 如:{%d+1}: 表示明天 |
| #F{} | {}之间是函数可写自定义JS代码 |
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']})"/>
My97DatePicker日期范围限制的更多相关文章
- MVC模式下My97DatePicker日期控件引用注意事项
My97DatePicker日期控件之前在用webform模式开发的时候,只要 <script language="javascript" type="text/j ...
- 根据条件决定My97DatePicker日期控件弹出的日期格式
代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <tit ...
- My97DatePicker日期控件的使用
本文演示如何在MyEclipse项目中使用My97DatePicker日期控件 1.下载My97DatePicker日期控件, My97DatePicker日期控件下载地址 2.在MyEclipse项 ...
- 为My97DatePicker日期插件设置默认日期
datepicker.zip 为My97DatePicker日期插件设置默认日期,开始日期为系统日期的前一个月,结束日期为系统日期: 开始日期不能大于结束日期,且都不能大于今天: 开始日期-maxDa ...
- my97DatePicker日期控件——日期输入框联动,使用focus使第二个输入框没展示出日期控件
描述问题场景: 1.jquery使用的版本是jquery-1.7.2.min.js 2.代码不是写在页面上的,是通过事件后追加的 <!DOCTYPE html> <html> ...
- My97DatePicker日期插件
My97DatePicker是一款优秀的日期插件,它可以很方便地实现各种日期选择效果,博得广大IT开发人员的青睐. 下面来讲讲它的常用功能及设置方法. 方法/步骤 先来最简单的配置方法: (1)下 ...
- My97DatePicker日期控件用法
用法很简单,主要演示都在myDate.html <meta http-equiv="content-type" content="text/html; chars ...
- My97DatePicker日期控件使用方法
My97DatePicker是一款网页版非常简单而且好用的日期控件,其实几年前就使用过了,这次再次用到,总结下: 首先去官网下载地址:http://www.my97.net/dp/down.asp 在 ...
- JQuery日历插件My97DatePicker日期范围限制
My97DatePicker是一个非常优秀的日历插件,不仅支持多种调用模式,还支持日期范围限制. 常规的调用比较简单,如下所示: 1 <input class="Wdate" ...
- ASP.NET 使用My97DatePicker日期控件
首先要下载该控件的包,下载地址:http://pan.baidu.com/s/1Aa5gk 引用文件 <script src="js/My97DatePicker/WdatePicke ...
随机推荐
- UNTIY3D接入91SDK的办法
原地址: http://bbs.18183.com/thread-111324-1-1.html UNITY3D接入Android-SDK 方法一:把UNITY3D游戏打成安卓项目文件,修改安卓项目文 ...
- NSTimer用法,暂停,继续,初始化
NSTimer用法,暂停,继续,初始化 转载:http://blog.csdn.net/zhuzhihai1988/article/details/7742881 NSTimer的使用方法 1.初始化 ...
- HDU 1533 最小费用最大流(模板)
http://acm.hdu.edu.cn/showproblem.php?pid=1533 这道题直接用了模板 题意:要构建一个二分图,家对应人,连线的权值就是最短距离,求最小费用 要注意void ...
- Qt5 程序启动画面图片效果
2333每次打开photoshop开启画面是在酷炫,其实也不难啦. 新建项目名称SplashScreen,基类默认,取消创建界面复选框,完成. 代码如下,图片资源文件自己添加(已上传还未实现动态效果学 ...
- 1.8---字符串是否是旋转而成(CC150)
答案:利用了XY , YX中第一个XYXY包含了第二个 public class Solution{ public static void main(String[] args){ System.ou ...
- idea java 正则表达式匹配替换
原文匹配中文 excelMap.get\((\"[\u4E00-\u9F15]+\")\) 目标 excelMap.get\($1.hashCode\(\)\)
- 【MavenWeb】初探:创建一个Maven Web项目
第一步:创建一个Simple的Maven项目 直接点下一步,把name上面的几个部分填写好,直接Finish即可. 就可以看到如下的结构: 注意点1:如果按照网上的其他一些做法来创建,你会发现少了sr ...
- zend studio安装svn插件
进入zend->Help->Install New Software 输入如下地址: http://subclipse.tigris.org/update_1.8.x 选择subclips ...
- CentOS6.5安装Tab增强版:bash-completion
CentOS6.5安装Tab增强版:bash-completion,可补全命令参数: 因为CentOS官方源并不带有bash-completion的包,所以,为了可用yum安装,增加epel的源, 首 ...
- .NET中六个重要的概念:栈、堆、值类型、引用类型、装箱和拆箱 (转)
作者: Edison Chou 来源: 博客园 发布时间: 2014-09-03 15:59 阅读: 318 次 推荐: 2 原文链接 [收藏] 原文作者:Shivprasad k ...