js--easyUI datetimebox 自定义显示格式 .

项目里需要显示自定义显示格式，比如只显示yyy,yyyy-mm,yyyy-mm-dd等格式。直接设置formatter参数的话，总是报错。用firefox调试后发现，好像在设置新的日期时

datetimebox控件会调用默认的parser指定的函数，把字符串转为日期格式。由于默认的只认"yyyy-MM-dd hh:mm:ss"格式(可以是其它分隔符,并非一定要是'-'),所以如果formatter函数返回的不是这个格式,会报错。

下面是我自己的实现方式：

datetimebox 设置:

[javascript] view plaincopyprint?

//加载日期控件   

function loadDate() {  

    startDTObj = $("#startDate");  

    endDTObj = $("#endDate");  

    startDTObj.datetimebox({  

                showSeconds:false,  

                formatter: formatDateText,  

                parser: parseDate  

            });  

    endDTObj.datetimebox({  

        showSeconds:false,  

        formatter: formatDateText,  

        parser: parseDate  

    });  

}  

//加载日期控件
function loadDate() {
startDTObj = $("#startDate");
endDTObj = $("#endDate");
startDTObj.datetimebox({
showSeconds:false,
formatter: formatDateText,
parser: parseDate
});
endDTObj.datetimebox({
showSeconds:false,
formatter: formatDateText,
parser: parseDate
});
}

[javascript] view plaincopyprint?

/格式化显示的文本  

function formatDateText(date) {  

    var rainType = rainTypeObj.combobox("getValue");  

    switch (rainType) {  

        case '0':  

                return date.formatDate("yyyy-MM-dd hh:mm");  

            break;  

        case '1':  

                return date.formatDate("yyyy-MM-dd hh");  

            break;  

        case '2':  

                return date.formatDate("yyyy-MM-dd");  

            break;  

        case '3':  

                return date.formatDate("yyyy-MM");  

            break;  

        case '4':  

                return date.formatDate("yyyy-MM");  

            break;  

        case '5':  

                return date.formatDate("yyyy");  

            break;  

        default:  

            break;  

    }  

}  

/格式化显示的文本
function formatDateText(date) {
var rainType = rainTypeObj.combobox("getValue");
switch (rainType) {
case '0':
return date.formatDate("yyyy-MM-dd hh:mm");
break;
case '1':
return date.formatDate("yyyy-MM-dd hh");
break;
case '2':
return date.formatDate("yyyy-MM-dd");
break;
case '3':
return date.formatDate("yyyy-MM");
break;
case '4':
return date.formatDate("yyyy-MM");
break;
case '5':
return date.formatDate("yyyy");
break;
default:
break;
}
}

本菜鸟写的，由于js,正则不是很熟，写得不好。月，日默认使用‘01’，时间部分默认使用‘00’

[javascript] view plaincopyprint?

//把时间格式字符串转化为时间   

//如下格式   

//2006   

//2006-01   

//2006-01-01   

//2006-01-01 12   

//2006-01-01 12:12   

//2006-01-01 12:12:12   

function parseDate(dateStr) {  

    var regexDT = /(\d{4})-?(\d{2})?-?(\d{2})?\s?(\d{2})?:?(\d{2})?:?(\d{2})?/g;  

    var matchs = regexDT.exec(dateStr);  

    var date = new Array();  

    for (var i = 1; i < matchs.length; i++) {  

        if (matchs[i]!=undefined) {  

            date[i] = matchs[i];  

        } else {  

            if (i<=3) {  

                date[i] = '01';  

            } else {  

                date[i] = '00';  

            }  

        }  

    }  

    return new Date(date[1], date[2]-1, date[3], date[4], date[5],date[6]);  

}  

//把时间格式字符串转化为时间
//如下格式
//2006
//2006-01
//2006-01-01
//2006-01-01 12
//2006-01-01 12:12
//2006-01-01 12:12:12
function parseDate(dateStr) {
var regexDT = /(\d{4})-?(\d{2})?-?(\d{2})?\s?(\d{2})?:?(\d{2})?:?(\d{2})?/g;
var matchs = regexDT.exec(dateStr);
var date = new Array();
for (var i = 1; i < matchs.length; i++) {
if (matchs[i]!=undefined) {
date[i] = matchs[i];
} else {
if (i<=3) {
date[i] = '01';
} else {
date[i] = '00';
}
}
}
return new Date(date[1], date[2]-1, date[3], date[4], date[5],date[6]);
}

网上找的别人写的格式化日期的方法，很好用

[javascript] view plaincopyprint?

//为date类添加一个format方法   

//yyyy 年   

//MM 月   

//dd 日   

//hh 小时   

//mm 分   

//ss 秒   

//qq 季度   

//S  毫秒   

Date.prototype.formatDate = function (format) //author: meizz   

{  

    var o = {  

        "M+": this.getMonth() + 1, //month   

        "d+": this.getDate(),    //day   

        "h+": this.getHours(),   //hour   

        "m+": this.getMinutes(), //minute   

        "s+": this.getSeconds(), //second   

        "q+": Math.floor((this.getMonth() + 3) / 3),  //quarter   

        "S": this.getMilliseconds() //millisecond   

    }  

    if (/(y+)/.test(format)) format = format.replace(RegExp.$1,  

    (this.getFullYear() + "").substr(4 - RegExp.$1.length));  

    for (var k in o) if (new RegExp("(" + k + ")").test(format))  

        format = format.replace(RegExp.$1,  

      RegExp.$1.length == 1 ? o[k] :  

        ("00" + o[k]).substr(("" + o[k]).length));  

    return format;  

}  

//为date类添加一个format方法
//yyyy 年
//MM 月
//dd 日
//hh 小时
//mm 分
//ss 秒
//qq 季度
//S  毫秒
Date.prototype.formatDate = function (format) //author: meizz
{
var o = {
"M+": this.getMonth() + 1, //month
"d+": this.getDate(),    //day
"h+": this.getHours(),   //hour
"m+": this.getMinutes(), //minute
"s+": this.getSeconds(), //second
"q+": Math.floor((this.getMonth() + 3) / 3),  //quarter
"S": this.getMilliseconds() //millisecond
}
if (/(y+)/.test(format)) format = format.replace(RegExp.$1,
(this.getFullYear() + "").substr(4 - RegExp.$1.length));
for (var k in o) if (new RegExp("(" + k + ")").test(format))
format = format.replace(RegExp.$1,
RegExp.$1.length == 1 ? o[k] :
("00" + o[k]).substr(("" + o[k]).length));
return format;
}

完成后效果：



项目里需要显示自定义显示格式，比如只显示yyy,yyyy-mm,yyyy-mm-dd等格式。直接设置formatter参数的话，总是报错。用firefox调试后发现，好像在设置新的日期时

datetimebox控件会调用默认的parser指定的函数，把字符串转为日期格式。由于默认的只认"yyyy-MM-dd hh:mm:ss"格式(可以是其它分隔符,并非一定要是'-'),所以如果formatter函数返回的不是这个格式,会报错。

下面是我自己的实现方式：

datetimebox 设置:

[javascript] view plaincopyprint?

//加载日期控件   

function loadDate() {  

    startDTObj = $("#startDate");  

    endDTObj = $("#endDate");  

    startDTObj.datetimebox({  

                showSeconds:false,  

                formatter: formatDateText,  

                parser: parseDate  

            });  

    endDTObj.datetimebox({  

        showSeconds:false,  

        formatter: formatDateText,  

        parser: parseDate  

    });  

}