简明现代魔法 -> JavaScript -> 一款优秀的JavaScript日历控件

一款优秀的JavaScript日历控件

2011-05-14

kimsoft-jscalendar 是一个简洁的avaScript日历控件,可在Java Web 项目,.NET Web 项目中使用。它具有以下特点:小巧,单文件;支持多语言,并可自由扩充(目前支持简体中文,繁体中文,英语美国和英语英国);兼容ie6.0+, firefox1.0+, Opera9,其它浏览器未测试;回显选定的时间,这是很多其它日历控件没有的;Apache license 2.0,商业友好。可免费使用,自由修改传播,但请保留版权信息;用 iframe 解决 IE 中层在 select 控件上显示的问题。

效果演示

用预定义的 calendar 对象生成日历代码:

<input name="date" type="text" id="date" onclick="calendar.show(this);" size="10" maxlength="10" readonly="readonly" />
效果:

当然也可以这样,new 一个新的日历对象并生成日历代码:

<input name="date" type="text" id="date" onclick="new Calendar().show(this);" size="10" maxlength="10" readonly="readonly "/>
效果:

指定开始年份和结束年份的日历代码:

<input name="range_date" type="text" id="range_date" onclick="new Calendar(2000, 2008).show(this);" size="10" maxlength="10" readonly="readonly" />
只能选择 2000 到 2008年间的日期:

多语言版本支持(可自由扩充),目前支持的语言:0(zh_cn)|1(en_us)|2(en_en)|3(zh_tw)

<input name="cn_date" type="text" id="cn_date" onclick="new Calendar().show(this);" size="10" maxlength="10" readonly="readonly"/>
中文简体:
<input name="tw_date" type="text" id="tw_date" onclick="new Calendar(null, null, 3).show(this);" size="10" maxlength="10" readonly="readonly" />
中文繁体:
<input name="en_date" type="text" id="en_date" onclick="new Calendar(null, null, 1).show(this);" size="10" maxlength="10" readonly="readonly" />
英文:
<input name="en_date" type="text" id="en_date" onclick="new Calendar(null, null, 4).show(this);" size="10" maxlength="10" readonly="readonly" />
日文:

在一个控件上点击选择,在另外一个控件上显示日期:

	<input name="control_date" type="text" id="control_date"size="10" maxlength="10" readonly="readonly" />
    <label>
      <input type="button" name="button" id="button" value="选择日期" onclick="new Calendar().show(this.form.control_date);" />
    </label>
效果:

更多请关注 code.google.com 上的kimsoft-jscalendar

随机文章推荐
网站分类


注:如需转载本文,请注明出处(原文链接),谢谢。更多精彩内容,请进入简明现代魔法首页。

进入新博客
喜欢本文,就分享它吧
给我留言
您的名字:
您的邮件:
您的网站:


 

copyright © 2009 简明现代魔法    学习、分享、进步

power by Gonn 感谢所有关心和支持本站的朋友们