§ ITPOW >> 业界资讯

作者：vkvi 来源：ITPOW（原创） 日期：2011-2-17

ezj v2.7 及之前的 ezj.ext.calendar 支持一句代码调用并创建日历（含时间）对话框，日期时间格式为标准的格式，但若想要使用自定义的格式，就办不到，而 ezj v2.8 中可以办到。（注意，到 2011-02-17，ezj v2.8 仍在开发中，并未发布。）

ezj v2.8 中是通过更改 ezj.ext.calendar 实现此功能的，目前代码如下（实际发布时可能与此不同）：

ezj.ext.calendar = function(inputField) { ///<summary>创建基于 The DHTML Calendar 的日历控件。语法：ezj.ext.calendar(inputField[, button[, showsTime[, format]]]) 或 ezj.ext.calendar(inputField[, config])</summary> ///<param name="inputField" type="string/object/array">存储、显示日历值的元素查询字符串，或元素对象，或元素对象数组。inputField 需是文本框。</param> ///<param name="button" type="string/object/array">可选。触发日历控件显示的元素查询字符串，或元素对象，或元素对象数组。默认值为 inputField 对应的元素。</param> ///<param name="showsTime" type="boolean">可选。是否在日历控件中显示时间部分。默认值为 false。</param> ///<param name="format" type="string">可选。日期时间格式。默认值为 %Y-%m-%d（不显示时间部分时）和 %Y-%m-%d %H:%M:%S（显示时间部分时）。</param> if (!ezj.ext.load("calendar", ["ext/calendar/calendar_stripped.js", "ext/calendar/lang/calendar-zh-utf8.js", "ext/calendar/calendar-setup_stripped.js"], ["ext/calendar/calendar-" + ezj.ext.calendar.skin + ".css"])) { return; } inputField = $(inputField); var button = inputField; var showsTime = false; var format = null; if (Function.like("any", "object") && !String.is(arguments[1].tagName)) { // 在 IE 中，HTML 元素也是 object 类型，这里用 tagName 排除之。 var config = arguments[1]; button = $(Object.prop(config, "button", button)); showsTime = Object.prop(config, "showsTime", showsTime); format = Object.prop(config, "format", format); } else { button = $(Function.overload(1, button)); showsTime = Function.overload(2, showsTime); format = Function.overload(3, format); } var inputFields = Array.from(inputField); var buttons = Array.from(button); inputFields.each(function(e, index){ if (format == null) { Calendar.setup({ inputField : inputFields[index], button : buttons[index], showsTime : showsTime, ifFormat : (!showsTime ? "%Y-%m-%d" : "%Y-%m-%d %H:%M:%S") }); } else { Calendar.setup({ inputField : inputFields[index], button : buttons[index], showsTime : showsTime, ifFormat : format }); } }); };

如果您急需此功能，可以拷贝此功能到 v2.7 的 ezj_source.js 的对应代码段，再通过 http://www.itpow.com/tools/online/jsPacker/ 将其打包成更小的 ezj.js。

要自定义日期时间格式，就指定 format 参数就可以了，比如下面的两段代码分别用两种方式展示了 format 的使用。

ezj.ext.calendar("t1", "t1", true, "%H时%M分%S秒"); ezj.ext.calendar("t2", { showsTime : true, format : "%p %I:%M:%S" });

format 格式参考

• %Y 四位数年
• %y 两位数年（00..99）
• %m 月（01..12）
• %d 日（00..31）
• %e 日（0..31）
• %p“PM”或“AM”（小写 %p 输出大写 PM、AM）
• %P“pm”或“am”（大写 %P 输出小写 pm、am）
• %H 小时（24 小时制）（00..23）
• %k 小时（24 小时制）（0..23）
• %I 小时（12 小时制）（01..12）
• %l 小时（12 小时制）（1..12）（%l 的 l 为 L 的小写）
• %M 分（00..59）
• %S 秒（00..59）
• %C 世纪（2000 年为 21 世纪）
• %B 月名称
• %b 月名称缩写（针对英文）
• %A 星期名称
• %a 星期名称缩写（比如星期四为“四”）
• %w 星期数字（1..7，1 表示星期一）
• %u 星期数字（0..6，0 表示星期日）
• %j 一年的第多少天（000..366）
• %U、%W、%V 周数
• %s 1970 年 1 月 1 日 0 时 0 分 0 秒（UTF）到指定时间的秒数
• %n 换行符
• %t 制表符
• %% 表示 %

官方网站

http://www.itpow.com/tools/downloads/ezj_V2.10.zip