吐槽归吐槽,工作还是不能懈怠滴,接下来说说日期选择的问题吧
首先上需求:
这个需求在后台管理里面是使用的比较频繁的,比如说在查询中:查询一周内的XXX,本月的XXX,上月的XXX等等的需求
技术解决方案:
和月份相关计算要抓住一个不变的日期,因为大家都知道每个月的天数是都不一样的,有28天,29天,30天和31天,所以要进行精确的计算就得抓住共性那就是每个月都有1号,和月份相关的计算1号这我觉得是一个关键点有了这一天你就可以随心所欲的进行日期操控
需求一:选择上个月我要显示出上个月月初和月末两个时间
假如这个月是8月那么所需要的两个日期就是2016-07-01和2016-07-31,初始日期每个月都一样很简单都是1号,而月末日期就像上面所说的就会有4中可能性,所以很简单的做法就是2016-08-01的时间戳减去一天的时间戳就是上个月月末,在这里大家还要注意当本月是1月和12月的情况,我们的算法思路说的差不多了,下面我们就看看代码
1 /** 2 * 日期格式化 3 * @param data 4 * @returns {string} 5 */ 6 function getFormatData(data) { 7 return data?[data.getFullYear(),is2length(data.getMonth()+1),is2length(data.getDate())].join('-'):'' 8 } 9 10 /** 11 * 判断长度 12 * @param numb 13 * @returns {string} 14 * 返回2位 15 */ 16 function is2length(numb) { 17 return numb.toString().length==2?numb:(0+''+numb) 18 } 19 20 /** 21 * 转为整数 22 * @param numb 23 * @returns {Number} 24 * 返回10进制 25 */ 26 function getIntager(numb) { 27 return parseInt(numb,10) 28 } 29 30 /** 31 * 返回日期 32 * @param arg 33 * @returns {number} 34 */ 35 function getDate(arg) { 36 var oneDay = 24*60*60*1000, 37 beforeAndAfer = arg*oneDay, 38 atLast = new Date().getTime() + beforeAndAfer 39 if(arguments[1]){ 40 atLast = arguments[1].getTime() + beforeAndAfer 41 } 42 return new Date(atLast) 43 } 44 45 /** 46 * 渲染到页面:渲染日期 47 * @param _parent 48 * @param date 49 * @param today 50 */ 51 function setVal(_parent,date,today) { 52 if(arguments.length==4){ 53 _parent.find('input').eq(1).val(getFormatData(date.monday)) 54 _parent.find('input').eq(2).val(getFormatData(date.sunday)) 55 }else{ 56 _parent.find('input').eq(1).val(getFormatData(date)) 57 _parent.find('input').eq(2).val(getFormatData(today?today:date)) 58 } 59 } 60 function setValAndReqNow(arg){ 61 // 今天周几 62 var isNow = new Date().getDay(), 63 // 通过今天计算出本周一对应的日期 64 monday = getDate(-getIntager(isNow)+1), 65 // 通过今天计算出本周天对应的日期 66 sunday = getDate(7-isNow), 67 diff = 0 68 switch (arg){ 69 case 1 : // 本周 70 monday = getDate(-getIntager(isNow)+1) 71 sunday = getDate(7-isNow) 72 break; 73 case 2 : // 下周 74 // 计算出周天离今天还有几天 75 diff = 7-getIntager(isNow) 76 // 计算出下周一日期 77 monday = getDate(diff+1) 78 // 计算出下周日日期 79 sunday = getDate(7+diff) 80 break; 81 case 3 : // 上周 82 // 计算出上周周天离今天还有几天 83 diff = getIntager(isNow) 84 // 计算出下周一日期 85 monday = getDate(-(6+diff)) 86 // 计算出下周日日期 87 sunday = getDate(-diff) 88 break; 89 case 4 : // 本月 90 /************************************************* 91 * 月末计算规则: 92 * 获取当前月份然后得到下个月1号对应的时间戳减去一天的时间戳 93 *************************************************/ 94 diff = getMonthMt() 95 // 获取下个月初 96 var end = getYearMt()+'-'+is2length((diff+1))+'-01' 97 // 获取下个月初 98 // 本月初 99 monday = getNowMonthFrist(diff)//new Date(getYearMt()+'-'+is2length((diff))+'-01') 100 // 本月末 101 sunday = getDate(-1,getNowMonthEnd(diff+1))//getDate(-1,new Date(end)) 102 break; 103 case 5 : // 上月 104 diff = getMonthMt() 105 // 获取下个月初 106 // 上月初 107 monday = getNowMonthFrist(diff-1,-1) 108 // 上月月末 109 sunday = getDate(-1,getNowMonthEnd(diff),-1) 110 break; 111 case 6 : // 下月 112 diff = getMonthMt() 113 // 获取下个月初 114 // 下月初 115 monday = getNowMonthFrist(diff+1,1) 116 // 下月月末 117 sunday = getDate(-1,getNowMonthEnd(diff+2),1) 118 break; 119 } 120 /************************************************* 121 * 本月日期区间计算规则: 122 * ----本月一号减去一天的时间戳----- 123 * 月末计算规则: 124 * 获取当前月份然后得到下个月1号对应的时间戳减去一天的时间戳 125 *************************************************/ 126 127 return{ 128 monday:monday, 129 sunday:sunday 130 } 131 } 132 // 获取当前月份 133 function getMonthMt() { 134 return getIntager(new Date().getMonth())+1 135 } 136 137 /** 138 * 返回准确的年月,确保上查询上一月和下一月的时候年份和月份不合适 139 * @param month 140 * @returns {{thisMonth: number, year: number}} 141 */ 142 function accurateYAndM(month) { 143 var year = 0, 144 thisMonth = 0 145 if(month==0&&arguments[1]==-1){ 146 year = getYearMt()-1 147 thisMonth = 12 148 }else if(month==13&&arguments[1]==1){ 149 year = getYearMt()+1 150 thisMonth = 1 151 }else{ 152 year = getYearMt() 153 thisMonth = month 154 } 155 return { 156 thisMonth:thisMonth, 157 year:year 158 } 159 } 160 // 获取当前X月初日期 161 function getNowMonthFrist(month) { 162 var yAndM = accurateYAndM(month) 163 return new Date(yAndM.year+'-'+is2length(yAndM.thisMonth)+'-01') 164 } 165 // 获取当前X月末日期 166 function getNowMonthEnd(month) { 167 var yAndM = accurateYAndM(month) 168 return new Date(yAndM.year+'-'+is2length(yAndM.thisMonth)+'-01') 169 } 170 // 获取当前年份 171 function getYearMt() { 172 return getIntager(new Date().getFullYear()) 173 }
这里主要是贴出来JS代码,getDate()方法主要用于计算出往前几天或者往后几天的日期,要计算往后几天的日期就输入一个正整数,比如输入1,就返回明天的日期,输入-1就会返回昨天的日期
在setValAndReqNow()方法中也提供也星期的选择,有兴趣的或者有用到的小伙伴可以看看,当然了代码有很多需要优化的和改进的地方或者是我考虑不周到的地方希望大神们指点,本人小白一枚,欢迎吐槽,我比较喜欢在吐槽中进步