1.什么是kimsoft-jscalendar
- 一个简洁的avaScript日历控件,可在Java Web 项目,.NET Web 项目中使用
2 kimsoft-jscalendar 有什么特点
- 1、小巧,单文件
- 2、支持多语言,并可自由扩充(目前支持简体中文,繁体中文,英语美国和英语英国)
- 3、兼容ie6.0+, firefox1.0+, Opera9,其它浏览器未测试
- 4、回显选定的时间,这是很多其它日历控件没有的
- 5、Apache license 2.0,商业友好。可免费使用,自由修改传播,但请保留版权信息
- 6、用 iframe 解决 IE 中层在 select 控件上显示的问题
- 7、其它特点有待发现...
3使用说明:
3.1、将 js 文件导入到页面中(可以是 html, jsp, asp, aspx, php)等。
<script type="text/javascript" src="calendar.js"></script>
注意以下点:
- calendar.js 文件内容编写是UTF-8,请一定要将此文件的编码设置为UTF-8
- 上面的代码内容一定要放在HTML的<body></body>之间,特别是在符合XHTML规范的文档中
- 包含此文件后,此页面已经自动实例化了一个日历对象 calendar,现在就可以使用了
3.2、一个最简单的例子
用预定义的 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
"
/>
多语言版本支持(可自由扩充),目前支持的语言: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 = " control_date " type = " text " id = " control_date " size = " 10 " maxlength = " 10 " readonly = " readonly " />
< input type = " button " name = " button " id = " button " value = " 选择日期 " onclick = " new Calendar().show(this.form.control_date); " />
< input name = " control_date " type = " text " id = " control_date " size = " 10 " maxlength = " 10 " readonly = " readonly " />
< input type = " button " name = " button " id = " button " value = " 选择日期 " onclick = " new Calendar().show(this.form.control_date); " />
文件下载: /Files/weiweibbs/calendar.js
/Files/weiweibbs/help.rar