My97DatePicker时间控件的使用

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

1.先来最简单的配置方法:

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

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

(3)在输入框input元素上<input type="text" class="Wdate" onClick="WdatePicker({autoPickDate:true,dateFmt:'yyyy-MM-dd'})" style="width: 120px;"/>

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


2.只读,添加控制:开始日期要小于当前日期或小于截止日期;截止日期要大于开始日期小于当前日期

<div>
     起始日期:
        <input type="text" class="Wdate" id="startTime" 
	onClick="WdatePicker({autoPickDate:true,dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'endTime\')||\'new Date()\'}',readOnly:true})" style="width: 120px;"/>
     截止日期:
	<input type="text" class="Wdate" id="endTime" 
	onClick="WdatePicker({autoPickDate:true,dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'startTime\')}',maxDate:new Date(),readOnly:true})" style="width: 120px;"/>
</div>

效果图:




3.获取输入框中的时间:

js中:

var startTime = $("#startTime").val();即可


功能相当强大 更人性化,更全面的功能 大部分日期控件都具备功能如:带时间显示,支持周显示,自定义格式,自动纠错,智能纠错,起始日期,操作按钮自定义,快速选择日期,支持多种调用模式等,My97DatePicker在这些方面做得更全面,更人性化,并且速度一流. 2.强大的日期范围限制功能 支持静态限制,动态限制,脚本自定义限制,以及无效天和无效日期功能,利用这样功能你可以任意定制不能选择的日期,这些日期即使毫无规律,毫无连续性,你也可以通过这些功能的组合使用轻松搞定. 3.自定义事件和丰富的API库 如果你需要做一些附加的操作,你也不必担心,日期控件自带的自定义事件可以满足你的需求.此外,你还可以在自定义事件中调用提供的API库来做更多的运算和扩展,绝对可以通过很少的代 码满足你及其个性化的需求. 4.多语言支持和自定义皮肤支持 通过lang属性,可以为每个日期控件单独配置语言,当然也可以通过WdatePicker.js配置全局的语言,皮肤也是一样,只要配置skin属性即可.这样一个页面中可以显示多种语言,多种皮肤的日期控件,更棒的是,他们之间的切换是无刷新的. 5.跨无限级框架显示和自动选择显示位置 无论你把日期控件放在哪里,你都不需要担心会被外层的iframe所遮挡进而影响客户体验,My97日期控件是可以跨无限级框架显示的,并且当控件处在页面边界是,它会自动选择显示的位置.此外你还可以使用position参数对弹出位置做调整.
我是控件的作者,请下载此版本<br><br>一个非常好用的web日期控件,功能非常优秀,绝对是你一直想要的日期控件.<br><br>更人性化,更全面的功能 <br>大部分日期控件都具备功能如:带时间显示,支持周显示,自定义格式,自动纠错,智能纠错,起始日期,操作按钮自定义,快速选择日期,支持多种调用模式等,My97DatePicker在这些方面做得更全面,更人性化,并且速度一流. <br><br>强大的日期范围限制功能 <br>支持静态限制,动态限制,脚本自定义限制,以及无效天和无效日期功能,利用这样功能你可以任意定制不能选择的日期,这些日期即使毫无规律,毫无连续性,你也可以通过这些功能的组合使用轻松搞定. <br><br>自定义事件和丰富的API库 <br>如果你需要做一些附加的操作,你也不必担心,日期控件自带的自定义事件可以满足你的需求.此外,你还可以在自定义事件中调用提供的API库来做更多的运算和扩展,绝对可以通过很少的代码满足你及其个性化的需求. <br><br>多语言支持和自定义皮肤支持 <br>通过lang属性,可以为每个日期控件单独配置语言,当然也可以通过WdatePicker.js配置全局的语言,皮肤也是一样,只要配置skin属性即可.这样一个页面中可以显示多种语言,多种皮肤的日期控件,更棒的是,他们之间的切换是无刷新的.<br><br>跨无限级框架显示和自动选择显示位置 <br>无论你把日期控件放在哪里,你都不需要担心会被外层的iframe所遮挡进而影响客户体验,My97日期控件是可以跨无限级框架显示的,并且当控件处在页面边界是,它会自动选择显示的位置.此外你还可以使用position参数对弹出位置做调整. <br><br>演示地址: http://www.my97.net/dp/demo/ <br>下载1: http://www.cnblogs.com/Files/my97/My97DatePicker.rar <br>下载2: http://my97.net/dp/down/My97DatePicker.rar <br>技术支持: http://www.my97.net/dp/support.asp <br>皮肤中心: http://www.my97.net/dp/skin.asp
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值