心就是AI

共知心是水，安见我非鱼

0%

js时间日期格式化及EasyUI时间控件的初始化

发表于 分类于 阅读次数：

js时间日期格式化

javascript没有提供标准可用的时间格式化相关方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
//格式化时间
$.formatDate = function(date,format){
    var padNum = function(num){
        return ("" + num).replace(/^(\d)$/,"0$1");
    }
    //指定格式字符
    var cfg = {
        yyyy : date.getFullYear() //年
        ,yy : date.getFullYear().toString().substring(2)
        ,M  : date.getMonth() + 1 //月
        ,MM : padNum(date.getMonth() + 1)
        ,d  : date.getDate() //日
        ,dd : padNum(date.getDate())
        ,H  : date.getHours() //时: 24小时制
        ,HH : padNum(date.getHours())
        ,h  : date.getHours()>12?date.getHours()-12:date.getHours() //时：12小时制
        ,hh : padNum(date.getHours()>12?date.getHours()-12:date.getHours())
        ,m  : date.getMinutes()
        ,mm : padNum(date.getMinutes()) //分
        ,s  : date.getSeconds()
        ,ss : padNum(date.getSeconds()) //秒
        ,SSS: (1000 + date.getMilliseconds() + "").substring(1) //毫秒
    }
    format || (format = "yyyy-MM-dd HH:mm:ss");
    return format.replace(/([yMdHhmsS])(\1)*/ig,function(m){
        var v = cfg[m];
        return v === undefined ? m : v;
    });
}

说明

  1. 该函数的两个参数分别为：1）时间日期 2）格式化字符串
  2. 返回值：按照format格式化的时间日期字符串
  3. 举例说明（以当前时间为2014-12-13 15:30:12为例, var date = new Date(); ）：
调用方式 返回值
$.formatDate(date, ‘yyyy-MM-dd HH:mm:ss,SSS’); 2014-12-13 15:30:12,000
$.formatDate(date, ‘yyyy-MM-dd HH:mm:ss’); 2014-12-13 15:30:12
$.formatDate(date, ‘yyyy-MM-dd HH:mm’); 2014-12-13 15:30
$.formatDate(date, ‘HH:mm:ss’); 15:30:12
$.formatDate(date, ‘yyyy年MM月dd日’); 2014年12月13日

时间日期处理(时间日期的计算)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
/**
 * 获取指定格式日期字符串
 * 参数：可传入三个参数，参数不分先后
 * Date类型参数：表示指定的时间，如果没有则为当前时间
 * String类型参数：格式，如果没有则为yyyy-MM-dd HH:mm:ss
 * Object类型参数：对时间的处理，该参数可以有的属性：
 * d:表示日，M：表示月，m:表示分钟，H:表示小时，y:表示年
 * 示例:$.getDateStr(new Date,'yyyy-MM-dd HH:mm:ss', {d:-3,H:5});将得5小时后的3天前
 */
$.getDateStr = function(){
    var date, format, options;

    for(var i=0; i<arguments.length; i++){
        var arg = arguments[i];
        if(arg === null || arg === undefined){
            continue;
        }
        if((typeof arg === 'string') && arg.constructor == String){
            format = arg;
        } else if((typeof arg === 'object')) {
            if(arg.constructor == Date){
                date = arg;
            } else {
                options = arg;
            }
        }
    }

    date = date || new Date();
    format = format || "yyyy-MM-dd HH:mm:ss";
    options = options || {};

    var cfg = {
        d: function(v){//天
            date.setDate(date.getDate() + v);
        },
        M: function(v){//月
            date.setMonth(date.getMonth() + v);
        },
        m: function(v){//分钟
            date.setMinutes(date.getMinutes() + v);
        },
        H: function(v){//小时
            date.setHours(date.getHours() + v);
        },
        y: function(v){//年
            date.setFullYear(date.getFullYear() + v);
        },
        s: function(v){//秒
            date.setSeconds(date.getSeconds() + v);
        },
        S: function(v){//毫秒
            date.setMilliseconds(date.getMilliseconds() + v);
        }
    }
    for(var k in options){
        cfg[k] && cfg[k](options[k]);
    }
    return $.formatDate(date, format);
}

说明

调用方式 返回值
$.getDateStr() 2014-12-13 15:30:12
$.getDateStr({d: 1}) 2014-12-14 15:30:12
$.getDateStr({d: -1}) 2014-12-12 15:30:12
$.getDateStr({d: -13}) 2014-11-30 15:30:12
$.getDateStr({H: -1}) 2014-12-13 14:30:12
$.getDateStr({M:-1, d: 1}) 2014-11-14 14:30:12
$.getDateStr('yyyy-MM-dd') 2014-12-13
$.getDateStr({M:-1},'yyyy-MM') 2014-11
var d = new Date();
d.setDate(25);
$.getDateStr(d,{M:-1},'yyyy-MM-dd 00:00:00');
 2014-11-25 00:00:00

EasyUI时间控件datetimebox的初始化

刚使用EasyUI的时间控件时，遇到一个问题，那就是如何初始化该该控件为系统当前时间或当前时间前一个小时，在网上搜了很久也没有满意答案
本文前两点时间格式化和时间日期计算都是为了这个EasyUI时间控件初始化做准备的
使用方式如下

1
2
3
<input name="startTime" id="startTime"  class="easyui-datetimebox"
    data-options="required:true,missingMessage:'开始时间不能为空', editable:false,
    value:$.getDateStr({H:-1})" style="width:183px;" />

说明
这里的value:$.getDateStr({H:-1})即是设置初始时间为当前时间的前一个小时

完