前言
jQuery UI是基于jQuery基础类库API开发的开源的JavaScript 网页UI（用户界面）代码组件库，使用jQuery UI可以实现Web UI界面交互、动画、特效和可更换主题的可视控件，并且还可以定制Web UI的主题风格。从而可以应用它轻松地构建出高度可交互的Web 应用程序的UI界面。
随着Web应用的普及及AJAX相关应用的深入，客户端和Web服务器端需要频繁地交互数据，对Web交互的界面也提出了新的要求——简洁、方便、人性化等用户体验度高；同时随着移动设备的普及，客户端的访问设备也逐渐多样化。如何为不同的客户端设备提供统一的Web应用界面，从而提高开发效率和降低开发成本。目前比较好的技术实现手段是应用JQuery及JQuery UI系统库相关的技术。
作者根据自身多年的软件开发实践和经验总结，结合多年的IT职业培训的教学和高校软件学院一线的教学工作体验，在本系列文档中通过具体的程序代码示例为读者介绍jQuery UI中典型的应用组件技术。本文档为jQuery UI datePicker日期组件的应用基础，主要涉及datePicker组件的技术特性、datePicker组件主要的成员属性及应用示例、datePicker 组件dialog成员方法、getDate成员方法和option等成员方法的应用示例，体现datePicker 组件的技术特性的应用示例等方面的内容。
杨教授大学堂精心创作有系列化的优秀程序员职业提升必读技术资料，这些资料将系统地从软件设计和开发实现的“设计思想”、“管理策略”、“技术实现”和“经验方法”等方面与读者进行充分的交流，涉及作者
对软件开发设计思想和原则、课程设计、项目实训、软件实现技术等方面的学习心得体会和应用技巧、经验总结。
本文目录
1.1datePicker组件的技术特性 (3)jquery在线免费学习
1.1.1datePicker组件主要的成员属性及应用示例 (7)
1.1.2datePicker组件dialog成员方法及应用示例 (15)
1.1.3datePicker组件getDate成员方法及应用示例 (19)
1.1.4datePicker组件option成员方法及应用示例 (22)
1.1.5体现datePicker组件的技术特性的应用示例 (29)
1.1 datePicker组件的技术特性
1、在多种平台中都提供有datePicker组件
由于在UI界面开发中，经常需要输入日期和时间等格式的数据，而日期和时间是有一定的格式和语言规范的要求。为了降低程序对用户输入的日期和时间数据检查的复杂性，在多种平台中都提供有datePicker组件。
（1）在iPhone和微软VC中都提供有datePicker组件
如下示图为作者在百度搜索中搜索datePicker组件的结果信息局部截图，在搜索结果中显示在iPhone和微软VC中都提供有datePicker组件。
（2）在VS.Net的C#和Android系统中也提供有datePicker组件
如下示图为作者在百度搜索中搜索datePicker组件的结果信息局部截图，在搜索结果中显示在VS.Net的C#和Android系统中也提供有datePicker组件。
2、JQuery UI中提供的datePicker组件主要的功能
（1）主要的功能
jQuery UI datePicker组件是一个高度可定制的插件，可以很方便地为Web页面中的表单内的日期和时间输入框组件提供输入和添加日期选择的功能，并且还可以自定义日期的显示格式以及要使用的语言、限制选择日期范围、添加相关按钮以及其它导航等功能，也还支持使用键盘的快捷键来驱动
datePicker组件。
（2）常用的控制键及对应的功能
jQuery UI datePicker组件不仅支持鼠标点选日期，同时也还可以通过键盘控制选择日期，如下为常用的键盘控制键及对应的功能说明。
1)pageup/down - 上一个/下一个月
2)ctrl+pageup/down - 上一年/下一年
3)ctrl+home- 当前月份
4)ctrl+up/down- 前一天/后一天
5)enter- 接受当前选定的日期
6)ctrl+end- 关闭日期插件的显示，并清除选定的日期
7)escape- 关闭日期插件，并不会清除已选择的日期
3、jQuery UI的jqueryui/datepicker/所提供的示例
在jQuery UI的jqueryui/datepicker/中提供有许多典型应用的示例，读者在学习中可以多阅读相关的示例代码以深入地掌握datePicker组件的内部工作机制和应用技巧。
4、技术帮助文档api.jqueryui/datepicker/
（1）技术帮助文档
在技术帮助文档中详细地对datePicker组件组件的主要属性、事件和方法都提供了相关的说明文档，读者在应用datePicker组件时可以随时查看相关的技术帮助文档以解决在应用开发中所遇到的技术问题。
（2）典型的应用示例
JQuery UI不仅提供了详细的技术帮助文档资料，也还提供有典型的应用示例，为读者展示在典型的应用需求下如何应用datePicker组件以及如何满足应用的需要的示例。作者在写本系列文档资料时，也多次参考JQuery UI中所提供的datePicker组件的应用示例，并对其中的一些示例进行了改进和完善。
5、定制datePicker组件内的日期显示的格式及示例
（1）了解datePicker组件内的dataFormat成员属性
该成员属性值为字符串类型，默认为“mm/dd/yy”。下面为格式字符串中的格式字母及含义：
1)  d - 每月的第几天（没有前导零）
2)dd - 每月的第几天（两位数字）
3)- 一年中的第几天（没有前导零）
4)oo - 一年中的第几天（三位数字）
5)  D - day name short
6)DD - day name long
7)m - 月份（没有前导零)
8)mm - 月份（两位数字)
9)M - month name short
10)MM - month name long
11)y - 年份（两位数字）
12)yy - 年份（四位数字）
（2）不同的日期显示格式的效果示图

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。