jquery ui很强大,其中的日期选择插件Datepicker是一个配置灵活的插件,我们可以自定义其展示方式,包括日期格式、语言、限制选择日期范围、添加相关按钮以及其它导航等。
这篇文章我们就来说说 jquery ui datepicker 的使用。
DatePicker基本使用方法:
文件引入
- <link?href="http://ajax.googleapis.com/ajax/libs/<a href="http://www.jquerycn.cn/" target="_blank">jquery</a>ui/1.8.18/themes/base/jquery-ui.css"?rel="stylesheet"?type="text/css"/>?
- <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>?
- <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
html代码:
- <div?type="text"?id="datepicker"></div>
js代码:
- ?
- $(document).ready(function()?{??
- ?$("#datepicker").datepicker();
- ?});
就这么简单,你只需要引入一个3个外部文件,即一个jquery库文件,一个jquery ui 核心文件,还有一个jquery ui 样式文件,然后用 datepicker() 方法就可以了。
请看示例代码 jquery ui datepicker 示例
jquery ui datepicker 公开的方法:
$.datepicker.setDefaults(?settings?)?-?全局设置日期选择插件的参数.
$.datepicker.formatDate(?format,?date,?settings?)?-?格式化显示的日期字符串
$.datepicker.iso8601Week(?date?)?-?给出一个日期,确实他是一年中的第几周
$.datepicker.parseDate(?format,?value,?settings?)?-?按照指定格式获取日期字符串
查看前两节教程