吐槽歸吐槽,工作還是不能懈怠滴,接下來說說日期選擇的問題吧
首先上需求:
這個需求在后台管理里面是使用的比較頻繁的,比如說在查詢中:查詢一周內的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()方法中也提供也星期的選擇,有興趣的或者有用到的小伙伴可以看看,當然了代碼有很多需要優化的和改進的地方或者是我考慮不周到的地方希望大神們指點,本人小白一枚,歡迎吐槽,我比較喜歡在吐槽中進步