My97DatePicker是一款十分不错的日期时间控件。

将My97DatePicker整个目录包,放入项目的相应目录下

My97DatePicker目录下各文件的作用:

 My97DatePicker目录是一个整体,不可破坏里面的目录结构,也不可对里面的文件改名,可以改目录名

各目录及文件的用途:

• WdatePicker.js 配置文件,在调用的地方仅需使用该文件,可多个共存,以xx_WdatePicker.js方式命名
• calendar.js 日期库主文件,无需引入
• 目录lang 存放语言文件,可以根据需要清理或添加语言文件
• 目录skin 存放皮肤的相关文件,可以根据需要清理或添加皮肤文件包

 可以根据自己的需要,删除不必要的皮肤和语言文件

该控件的使用方法相对比较简单，引用WdatePicker.js之后，通过WdatePicker（）即可弹出日期控件，效果如下所示。

<- 点我弹出日期控件

上例代码如下：

<input class="Wdate" onclick="WdatePicker()" type="text" /> <font color="red"><- 点我弹出日期控件</font>

此外，该控件还可以对事件进行绑定，下面的例子展示了onpicked事件的绑定过程

<- onpicked事件

上例代码如下：

<input class="Wdate" onclick="WdatePicker({onpicked:onpicked})" type="text" /> <font color="red"><- onpicked事件</font>

function onpicked() {
  alert($(this).val());
}

此外，该控件还可以自定义日期的显示格式，下面的例子展示了季度的显示

<- onpicked事件

上例代码如下：

<input class="Wdate" onclick="WdatePicker({dateFmt:'yyyy年 MM季度', 
isQuarter:true, isShowOK:false, 
disabledDates:['....-0[5-9]-..','....-1[0-2]-..'], 
startDate:'%y-01-01' })" type="text" /> <font color="red"><- onpicked事件</font>

 

本文链接：http://bookshadow.com/weblog/2014/07/20/my97datepicker-introduction/
请尊重作者的劳动成果，转载请注明出处！书影博客保留对文章的所有权利。

如果您喜欢这篇博文，欢迎您捐赠书影博客： ，查看支付宝二维码