html部分:
<input type="text" id='astartTime'class="easyui-datebox" required="true"style="width:150px;"/>
js部分
//初始化控件,并设置选择时间显示格式
$('#astartTime').datebox({formatter:myformatter});
//设置初始时间为当前时间
$('#astartTime').datebox("setValue",myformatter(newDate()));
//获取选择时间
$("#astartTime").datebox('getValue');
//这种方式不是太符合我们习惯,那么我们可以给它添加一个事件监听,在dateboxonSelect 日期选中后,自动为input id="dd"type="text"赋值,然后我们就可以使用
$("#astartTime ").val()获取选中的日期值了。
具体代码如下:
$("#astartTime").datebox({
onSelect: function(date){
$("#astartTime ").val(date);
}
});
//---------------时间格式处理---------
function myformatter(date) {
var y =date.getFullYear();
var m =date.getMonth() + 1;
var d =date.getDate();
return y +'-' + (m < 10 ? ('0' + m) : m) + '-'
+ (d < 10? ('0' + d) : d);
}
function datetoymd(date) {
var y =date.getFullYear();
var m =date.getMonth() + 1;
var d =date.getDate();
return y + ''+ (m < 10 ? ('0' + m) : m) + ''
+ (d < 10? ('0' + d) : d);
}
//对应parser 属性,解析yyyy-MM-dd数据
function myparser(s) {
if (!s)
returnnew Date();
var ss =(s.split('-'));
var y =parseInt(ss[0], 10);
var m =parseInt(ss[1], 10);
var d =parseInt(ss[2], 10);
if (!isNaN(y)&& !isNaN(m) && !isNaN(d)) {
returnnew Date(y, m - 1, d);
} else {
returnnew Date();
}
}
function strtodate(str)
{
var y =str.substring(0,4);
var m =str.substring(4,6);
var d =str.substring(6,8);
returny+'-'+m+'-'+d;
}
function datahandler(s)
{
var ss =(s.split('-'));
var y =parseInt(ss[0], 10);
var m =parseInt(ss[1], 10);
var d =parseInt(ss[2], 10);
returny+''+(m < 10 ? ('0' + m) : m)+''+(d < 10 ? ('0' + d) : d);
}
属性
其属性扩展自combo,下列是为databox增加的属性
名称 | 类型 | 说明 | 默认值 |
panelWidth | number | 下拉日历面板的宽度 | 180 |
panelHeight | number | 下拉日历面板的高度 | auto |
currentText | string | 当前日期按钮上显示的文字 | Today |
closeText | string | 关闭按钮上显示的文字 | Close |
okText | string | 确定按钮上显示的文字 | OK |
disabled | boolean | 为true时禁用该域 | false |
formatter | function | 格式化日期的函数,此函数有一个'date'参数,并返回一个字符串值 | |
parser | function | 解析日期字符串的函数,此函数有一个'date'字符串参数,并返回一个日期值 |
事件
名称 | 参数 | 说明 |
onSelect | date | 当用户选择一个日期时触发 |
方法
其方法扩展自combo,下列是为datebox重定的方法
名称 | 参数 | 说明 |
options | none | 返回options对象 |
calender | none | 获取calender对象 |
setValue | value | 设置databox值 |