jQuery UI教程之三—jQuery UI DatePicker的使用
jquery ui很強大,其中的日期選擇插件Datepicker是一個配置靈活的插件,我們可以自定義其展示方式,包括日期格式、語言、限制選擇日期范圍、添加相關(guān)按鈕以及其它導(dǎo)航等。
這篇文章我們就來說說 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?)?-?全局設(shè)置日期選擇插件的參數(shù).
$.datepicker.formatDate(?format,?date,?settings?)?-?格式化顯示的日期字符串
$.datepicker.iso8601Week(?date?)?-?給出一個日期,確實他是一年中的第幾周
$.datepicker.parseDate(?format,?value,?settings?)?-?按照指定格式獲取日期字符串
查看前兩節(jié)教程