jQuery ui中日期控件datepicker的使用整理

一、控件的引入

该控件依赖于jQuery，故需要先引入jQuery。

<link href="//cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.css" rel="stylesheet">
<script src="//cdn.bootcss.com/jquery/2.2.4/jquery.js"></script>
<script src="//cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.js"></script>
<script>
    $('#start-date').datepicker();
</script>

二、控件的选项

defaultDate    设置日期控件的默认日期（高亮显示的日期），如果没有设置该选项，那么就使用当前日期，这一选项只适用于input元素没有设置value属性的情况
altField       额外自定一个input元素，但用户作出选择时，把这个input元素的值更新为用户选取的日期
showOn         设置弹出式日期拾取器的弹出条件，默认值为focus，支持三种值focus（input元素得到焦点时）、button（单击按钮时）、both（以上两种方式），如果把showOn选项设置为button或者both，日期拾取器组件会创建一个button元素并把它立即插入到input元素之后。可以使用buttonImage和buttonText选项来调整这个按钮元素的外观。
buttonImage    指定触发弹出式日期拾取器按钮图片的url，默认不适用图片
buttonImageOnly  使用img元素而不是button元素来显示buttonImage选项指定的图片，默认值为false
buttonText     指定触发弹出式日期拾取器按钮上的文本，默认值为省略号（...）
disabled       设置日期拾取器初始状态是否可用，默认值为false（表示可用）

三、控件的方法

datepicker("destroy")        从底层元素上移除日期拾取器组件    
datepicker("disable")        禁用日期拾取器
datepicker("enable")         启用日期拾取器
datepicker("option")         设置日期拾取器选项
datepicker("isDisabled")     判断日期拾取器是否被禁用，如果已被禁用，返回true
datepicker("hide")           隐藏弹出式日期拾取器
datepicker("show")           显示弹出式日期拾取器
datepicker("refresh")        刷新日期拾取器以反映底层元素的变化
datepicker("getDate")        从日期拾取器组件中得到当前选中日期
datepicker("setDate", date)  为日期拾取器设置选中日期

四、控件的事件

create               在日期拾取器组件创建之后触发
onChangeMonthYear    当用户跳到一个新的月或者新的年时触发,3个参数：修改的年year、修改的月month、当前datepicker对象
onClose              当弹出式日期拾取器被关闭后触发
onSelect             当用户选中一个日期时触发，2个参数：选中的日期date、当前datepicker对象