Posted on 2009-08-27 01:24
lxasp 阅读(2364)
评论(3) 编辑 收藏 引用 所属分类:
AJAX
到目前为止，jQuery一直都没有一个功能灵活而代码小于10KB的日历显示、日期选取、时间选取三合一功能的插件。因此就只好自己动手写了此插件。
本插件严格控制代码的大小，目前的大小：
source code size: ~8kb , jsmin size: ~4kb
演示地址：
http://www.lxasp.com/jq/demo/datetimecal/calendar-demo2.htm弹出选取的演示：
http://www.lxasp.com/jq/demo/datetimecal/cluetipDate-demo1.htm【◆】预先准备：（不由本插件来做）
用DreamWeaver等HTML工具画一个7x7的表格
第一行作为标题，预先填好“日一二三四五六”
使用本插件的必要的网页元素：
◆HTML模板（有按钮、文本、7x7的表格“含标题:日一二三四五六”等）
◆显示本插件的目标DIV和相关CSS
◇这样一来，本插件就自然有了换肤、多语言功能。因为这些都交给使用此插件的开发者去做了，灵活性就当然不在话下了。
【◆】编程思路：（由本插件来做）
①输入一个日期时间(年,月,日,时,分,秒)，取得该月的1号是星期几
②在7x7表格从第二行起，按“该月的1号是星期几”填充日期“1”至到该月的最后一天（判断闰年等）
【◆】备注说明：
◆在箭头的按钮上，单击则加减1个数值，长按则连续加减，松开则停止加减
◆本插件输入和输出的日期时间是JavaScript的Date对象
【◆】暂时不会加入的功能：
◆不含日期字符串格式化函数，这个网上有很多版本，自己搜索
◆不会绑定某个input控件，因为有onChanged事件，自己加代码
◆不会作为浮动层弹出或拖动，因为有其他插件(ClueTip、Dialog等)能做到
◆不会验证日期格式的有效性和禁止选择某天，因为有强大的表单验证插件
◆不会加入两个日期范围之间的选择，本插件本身可以在一个页面多次使用
◆不会加入键盘控制功能，因为可以在input里输入和有表单验证插件来控制