最近做項目遇到這樣一個需求:用戶每天第一次打開頁面時顯示蒙層,以後打開就不再顯示。
解決方法就是設置一個標誌放在cookie裏,頁面加載時判斷當前cookie中有沒有此標誌,如果沒有就顯示蒙層,同時把標誌放入cookie中,並設置當天24點過期;如果有就不顯示蒙層。
下面是設置cookie過期時間是當天24點的代碼:
var curDate = new Date()
console.log('curDate===',curDate)
// 當前時間戳 getTime 返回 1970 年 1 月 1 日至今的毫秒數。
var curTamp = curDate.getTime()
console.log('curTamp===', curTamp)
// 當日凌晨的時間戳,減去一毫秒是爲了防止後續得到的時間不會達到00:00:00的狀態
// toLocaleDateString() 根據本地時間格式,把 Date 對象的日期部分轉換爲字符串。
// 如:會把Thu May 21 2020 20:41:59 GMT+0800 (中國標準時間) 轉換成 2020/5/21
var curWeeHours = new Date(curDate.toLocaleDateString()).getTime() - 1
console.log('curWeeHours===',curWeeHours)
// 當日已經過去的時間(毫秒)
var passedTamp = curTamp - curWeeHours
console.log('passedTamp===', passedTamp)
// 當日剩餘時間 一天共有24 * 60 * 60 * 1000 = 86,400,000毫秒
var leftTamp = 24 * 60 * 60 * 1000 - passedTamp
console.log('leftTamp===', leftTamp)
var leftTime = new Date()
// setTime() 以毫秒設置 Date 對象。
leftTime.setTime(leftTamp + curTamp)
// 創建cookie
// toUTCString() 根據世界時,把 Date 對象轉換爲字符串。
document.cookie = 'firstEnter=have' + ';expires=' + leftTime.toUTCString()