日期组合框 - DateBox
继承至$.fn.combo.defaults.,覆盖默认值$.fn.datebox.defaults
datebox 关联了一个可编辑的文本框和一个下拉calendar panel(日期面板)并且允许用户选择一个日期,输入一个字符串到文本框中能够转换为一个有效值选择日期也可以被格式化为你想要的格式.
Dependencies
- combo
- calendar
Usage Example
从标记创建datebox.
使用javascript创建datebox.
Properties
属性继承至combo, 以下是datebox新增的属性.
| Name | Type | Description | Default |
|---|---|---|---|
| panelWidth | number | 下拉日期面板宽度. | 180 |
| panelHeight | number | 下拉日期面板高度. | auto |
| currentText | string | 显示在当前日期按钮上的文本. | Today |
| closeText | string | 显示在close按钮上的文本. | Close |
| okText | string | 显示在ok按钮上的文本. | Ok |
| disabled | boolean | 当设置为true时禁用该组件. | false |
| formatter | function | 转换日期的函数,这个函数提供一个'data'参数和返回一个string类型值.以下示例展示如何重写默认的formatter 函数. $.fn.datebox.defaults.formatter = function(date){
var y = date.getFullYear();
var m = date.getMonth()+1;
var d = date.getDate();
return m+'/'+d+'/'+y;
}
|
|
| parser | function | 一个转换日期字符串的函数,这个函数提供一个'date'字符串,和返回一个date值.以下示例展示如何重写默认的 parser 函数. $.fn.datebox.defaults.parser = function(s){
var t = Date.parse(s);
if (!isNaN(t)){
return new Date(t);
} else {
return new Date();
}
}
|
Events
| Name | Parameters | Description |
|---|---|---|
| onSelect | date | 当用户选择一个日期的时候触发.
示例代码: $('#dd').datebox({
onSelect: function(date){
alert(date.getFullYear()+":"+(date.getMonth()+1)+":"+date.getDate());
}
}); |
Methods
方法继承至combo,以下是datebox重写的方法
| Name | Parameter | Description |
|---|---|---|
| options | none | 返回options 对象. |
| calendar | none | 得到日期对象.下面示例展示如何得到calendar对象然后重新创建. // 得到calendar 对象
var c = $('#dd').datebox('calendar');
//设置一周的第一天为星期一
c.calendar({
firstDay: 1
});
|
| setValue | value | 设置datebox值.
示例代码: $('#dd').datebox('setValue', '6/1/2012'); // 设置datebox 值
var v = $('#dd').datebox('getValue'); // 得到 datebox值
|