最近在学习 javascript,当然首推的就是 jQuery 了,之前因為懒得做日期表单,因為日期表单需要三种栏位,一个是年,一个是月,一个是日,相当麻烦,一直在那边 for 迴圈也不是办法,虽然那是个解决方法,然后我之前用了xt:Commerce 这套 opensource的程式码,把日期函式取出来:[Html] javascript 好用的时间日历表,不过我认為这方法也太麻烦,因為 jQuery 一行就可以解决的事情,干麼还要用那个方法呢?
再来呢介绍一下怎麼使用日期函式
步骤一:加上 jQuery 套件到 head 跟 /head 之间
步骤二:加上 ui.datepicker.css 跟 ui.datepicker.js jQuery UI Date Picker CSS and the jQuery UI Date Picker Javascript
步骤三:教大家使用四种基本方法:
1. 最基本的语法 (mm/dd/yyyy).
$('#example1').datepicker();
});
2. 加上旁边图示也可以进行操作
showWeeks: true, firstDay: 1, changeFirstDay: false,
buttonImageOnly: true, buttonImage: 'calendar.gif'});
3. 改变时间格式
buttonImageOnly: true, buttonImage: 'calendar.gif'});
4. 选择日期范围
buttonImageOnly: true, buttonImage: 'calendar.gif'});
5. 初始话时间,加7天
# 增加7天时间
#
$('input selector').datepicker({defaultDate: +7});
程式执行画面:
Demo介绍
Demo档案下载:datepickerdemo coreuidatepicker
参考网站:
http://docs.jquery.com/UI/Datepicker
http://marcgrabanski.com/code/ui-datepicker/
http://kelvinluck.com/assets/jquery/datePicker/v2/demo/
相关主题
- [jQuery] AJAX 学习笔记 (一) 如何使用 JSON 验证使用者表单 (0)
- [jQuery笔记] 时间日期外掛:timepicker | jQuery Plugins (0)
- [教学]网页简体繁体转换程式(Google AJAX Language API) (0)
- [AJAX] google map 的应用~ (0)
- [jQuery] [影片] 12岁的小孩到 Google 讲 jQuery (0)
- [相簿] Coppermine Photo Gallery Album Expander (0)
- [WWW] firefox and IE 的 greasemonkey (0)
- [Html] javascript 好用的时间日历表 (1)
![]() |
Austin Liu 刘恒辉
Project Manager and Software Designer E-Mail:lzhdim@163.com Blog:https://lzhdim.cnblogs.com 欢迎收藏和转载此博客中的博文,但是请注明出处,给笔者一个与大家交流的空间。谢谢大家。 |