提供图形化的日历界面供用户选择日期与时间,提供简洁的接口供开发者输出自定义格式的时间。
var cal = new Calendar({..attributes..});
trigger 唤出日历的元素,可以是:
- 选择器
- element
- jQuery Object
唤出日历的事件,默认为 click
日历初始聚焦的日期,默认为今天。接受任何 moment 支持的参数,推荐使用 YYYY-MM-DD
格式。
输出日期格式,默认为 YYYY-MM-DD
同 Overlay 的设置,一般不用处理,如需了解详情,请参考 arale.position 的 pin 方法。
基本设置方法:
{
selfXY: [0, 0], // element 的定位点,默认为左上角
baseElement: Position.VIEWPORT, // 基准定位元素,默认为当前可视区域
baseXY: [0, 0] // 基准定位元素的定位点,默认为左上角
}
一周从哪一天开始,默认周日是一周的开始。
可使用数字 0-6,可使用 'Sun', 'Tue' 等简写,还可以使用 'Sunday', 'Thursday' 等全称。
设置可选范围,可接受数组与函数。例如 [startDate, endDate],其中 startDate 与 endDate 支持所有 moment 支持的写法。
推荐使用: ["2012-12-12", "2014-01-01"]
这种写法,方便阅读。
函数示例:
range: function(time) {
return time.day() > 1;
}
一般情况下,你不需要使用下面的方法。
显示日历。继承自 Overlay。
隐藏日历。继承自 Overlay。
动态修改日历的 range,参考双日历演示。
cal.range(['2012-10-10', '2012-10-19'])
切换到上一年。
切换到下一年。
切换到上一月。
切换到下一月。
事件监听:
cal.on('..event..', function(param){
// do something
})
当用户选择日期时。
.on('selectDate', function(date) {
// date is a moment instance
})
当用户选择了不可用的日期时。
.on('selectDisabledDate', function(date) {
// date is a moment instance
})
该日历大量使用 moment,请查看 moment 官网,获取更多帮助。