My97DatePicker日期插件的常用功能说明

文章出处:https://jingyan.baidu.com/article/e6c8503c7244bae54f1a18c7.html

My97DatePicker是一款优秀的日期插件,它可以很方便地实现各种日期选择效果

(1)下载WdatePicker.js(包括lang和skin文件夹)。

(2)在html页面中导入WdatePicker.js。

(3)在输入框input元素上加入class="Wdate" onFocus="WdatePicker({lang:'zh-cn'})"代码。

(4)打开页面查看效果。

 

My97DatePicker日期插件的常用功能说明

 

My97DatePicker日期插件的常用功能说明

 

详细讲解它的各种常用功能。

1.显示年:dateFmt:'yyyy'

My97DatePicker日期插件的常用功能说明

My97DatePicker日期插件的常用功能说明

2.显示年月:dateFmt:'yyyyMM'

My97DatePicker日期插件的常用功能说明

My97DatePicker日期插件的常用功能说明

3.显示年月日:dateFmt:'yyyyMMdd'

My97DatePicker日期插件的常用功能说明

My97DatePicker日期插件的常用功能说明

4.

显示年月日时分秒:dateFmt:'yyyyMMdd HH:mm:ss'

My97DatePicker日期插件的常用功能说明

My97DatePicker日期插件的常用功能说明

5.

格式化:年月日时分秒:dateFmt:'yyyy年MM月dd日 HH时:mm分:ss秒'

My97DatePicker日期插件的常用功能说明

My97DatePicker日期插件的常用功能说明

6.

设置只读:readOnly:true

My97DatePicker日期插件的常用功能说明

My97DatePicker日期插件的常用功能说明

7.

隐藏清空按钮:isShowClear:false

My97DatePicker日期插件的常用功能说明

My97DatePicker日期插件的常用功能说明

8.

设置今天为最小日期:minDate:new Date()

 

My97DatePicker日期插件的常用功能说明

My97DatePicker日期插件的常用功能说明

9.

设置今天为最大日期:maxDate:new Date()

My97DatePicker日期插件的常用功能说明

My97DatePicker日期插件的常用功能说明

设置明天为最小日期:minDate:'%y-%M-{%d+1}'

My97DatePicker日期插件的常用功能说明

My97DatePicker日期插件的常用功能说明

10.

只能选择本月第一天到最后一天:minDate:'%y-%M-01',maxDate:'%y-%M-%ld'

My97DatePicker日期插件的常用功能说明

My97DatePicker日期插件的常用功能说明

11.

开始日期不能大于结束日期,且都不能大于今天:

开始日期-maxDate:'#F{$dp.$D(\'endDate\')||\'new Date()\'}'

结束日期-minDate:'#F{$dp.$D(\'startDate\')}',maxDate:new Date()

My97DatePicker日期插件的常用功能说明

My97DatePicker日期插件的常用功能说明

My97DatePicker日期插件的常用功能说明

12.

设置显示周:

My97DatePicker日期插件的常用功能说明

My97DatePicker日期插件的常用功能说明