微信小程序之 js 时间戳1000 转换 秒,六个小时后,一天后,本周五 选项计算时间

it2024-11-20  9

1、js取当前时间的秒级时间戳

parseInt(new Date().getTime()/1000);, //或 Date.parse(new Date())/1000;

2、将当前日期转换为时间戳。

(1)、当前时间的时间戳

var now = new Date(); console.log(now.getTime()) //当前时间的时间戳 // 将当前日期转换为时间戳,getTime()方法可返回距1970年1月1日之间的毫秒数。 //也可以使用 +now ,该效果等同于now.getTime()

(2)、将指定日期转换为时间戳。

var t = "2017-12-08 20:5:30"; // 月、日、时、分、秒如果不满两位数可不带0. var T = new Date(t); // 将指定日期转换为标准日期格式。Fri Dec 08 2017 20:05:30 GMT+0800 (中国标准时间) console.log(T.getTime()) // 将转换后的标准日期转换为时间戳。

3、将时间戳转换为日期。

var t = 787986456465; // 当参数为数字的时候,那么这个参数就是时间戳,被视为毫秒,创建一个距离1970年1月一日指定毫秒的时间日期对象。 console.log(new Date(t)) // Wed Dec 21 1994 13:07:36 GMT+0800 (中国标准时间) var t2 = "2017-5-8 12:50:30"; console.log(new Date(t2)) // Mon May 08 2017 12:50:30 GMT+0800 (中国标准时间) var t3 = "2017-10-1"; console.log(new Date(t3)) // Sun Oct 01 2017 00:00:00 GMT+0800 (中国标准时间) 不设定时分秒,则默认转换为00:00:00

4、将时间戳转换为指定格式日期的方法封装:

// 格式化日期,如月、日、时、分、秒保证为2位数 function formatNumber (n) { n = n.toString() return n[1] ? n : '0' + n; } // 参数number为毫秒时间戳,format为需要转换成的日期格式 function formatTime (number, format) { let time = new Date(number) let newArr = [] let formatArr = ['Y', 'M', 'D', 'h', 'm', 's'] newArr.push(time.getFullYear()) newArr.push(formatNumber(time.getMonth() + 1)) newArr.push(formatNumber(time.getDate())) newArr.push(formatNumber(time.getHours())) newArr.push(formatNumber(time.getMinutes())) newArr.push(formatNumber(time.getSeconds())) for (let i in newArr) { format = format.replace(formatArr[i], newArr[i]) } return format; } //如需要调用上述方法,使用formatTime(1545903266795, 'Y年M月D日 h:m:s') //或者formatTime(1545903266795, 'Y-M-D h:m:s')即可

5、小程序案例

需求及效果图: 下次追访时间 添加 6小时后,一天后,本周五 三个快捷选项

案例讲解: 如果下次追访时间 为周五周六周日 ,则不显示本周五选项;

html:

<view class="addloupantan areatan addzhftan" wx:if="{{isaddzhuifang}}"> <view class="addmain"> <image src="../../images/lpsel-xx.png" mode="widthFix" class="addxx" bindtap="areatanxx" /> <view class="khinputbox"> <view class="zhuifangbox"> <view class="inptxt">追访记录</view> <textarea class="areabox" value="{{zfang_log}}" focus="true" bindinput="zhfareainp" /> <view class="nextzhfkjbox zhuibomtxt"> <view>快捷选择</view> <!-- zfselkj --> <text class="select" wx:for="{{zfseltxtarr}}" wx:key="index" wx:if="{{index != 2 || (index == 2 && weekday != '星期五' && weekday != '星期六' && weekday != '星期天') }}" data-index="{{index}}" bindtap="zfselkj">{{item}}</text> </view> <view class="zhuibomtxt"> <view>下次追访时间</view> <picker class="select" mode="date" value="{{next_zhuifang_day}}" start="{{startdate}}" end="{{enddate}}" bindchange="bindDateChange"> <view class="picker">{{next_zhuifang_day}}</view> </picker> <view class="select bomnone smselect">{{weekday}}</view> <picker class="select smselect" mode="time" value="{{zhuifang_time}}" start="00:00" end="23:59" bindchange="bindTimeChange"> <view class="picker">{{zhuifang_time}}</view> </picker> </view> </view> </view> <view class="addqueding" bindtap="addzhuifangtaninp">确定</view> </view> </view>

js:(util.js 时间戳转换格式) 文件位置:

const formatTime = (date) => { const year = date.getFullYear() const month = date.getMonth() + 1 const day = date.getDate() const hour = date.getHours() const minute = date.getMinutes() const second = date.getSeconds() return [hour, minute].map(formatNumber).join(':') } const formatDate = (date) => { const year = date.getFullYear() const month = date.getMonth() + 1 const day = date.getDate() return [year, month, day].map(formatNumber).join('-') } const tomorrowDate = (date) => { const year = date.getFullYear() const month = date.getMonth() + 1 const day = date.getDate() + 1 return [year, month, day].map(formatNumber).join('-') } const endYear = (date) => { const year = date.getFullYear() + 30 const month = date.getMonth() + 1 const day = date.getDate() return [year, month, day].map(formatNumber).join('-') } const lfYear = (date) => { const year = date.getFullYear() - 10 const month = date.getMonth() + 1 const day = date.getDate() return [year, month, day].map(formatNumber).join('-') } function timeTodate(number, format) { var formateArr = ['Y', 'M', 'D', 'h', 'm', 's'] var returnArr = [] var date = new Date(number * 1000) returnArr.push(date.getFullYear()) returnArr.push(formatNumber(date.getMonth() + 1)) returnArr.push(formatNumber(date.getDate())) returnArr.push(formatNumber(date.getHours())) returnArr.push(formatNumber(date.getMinutes())) returnArr.push(formatNumber(date.getSeconds())) for (var i in returnArr) { format = format.replace(formateArr[i], returnArr[i]) } return format } function transTime(unixtime) { var dateTime = new Date(parseInt(unixtime) * 1000) var year = dateTime.getFullYear() var month = dateTime.getMonth() + 1 var day = dateTime.getDate() var hour = dateTime.getHours() var minute = dateTime.getMinutes() var second = dateTime.getSeconds() var now = new Date() var now_new = Date.parse(now.toDateString()) var milliseconds = now_new - dateTime var timeSpanStr = year + '-' + month + '-' + day return timeSpanStr } const formatNumber = (n) => { n = n.toString() return n[1] ? n : '0' + n } function getWeek(todate) { let weetoday = new Date(todate.replace(/-/g, '/')) // console.log(weetoday); var day = weetoday.getDay() // console.log(new Date('2018-09-03'.replace(/-/g, "/")).getTime()); // var day = getDate(todate).getDay(); switch (day) { case 0: return '星期天' break case 1: return '星期一' break case 2: return '星期二' break case 3: return '星期三' break case 4: return '星期四' break case 5: return '星期五' break case 6: return '星期六' break } } module.exports = { formatTime: formatTime, formatDate: formatDate, tomorrowDate: tomorrowDate, endYear: endYear, lfYear: lfYear, timeTodate: timeTodate, transTime: transTime, getWeek: getWeek, }

wxjs:

let util = require('../../utils/util.js') Page({ data{ isaddzhuifang:1, zfang_log: '', //追访记录 zfseltxtarr: ['6小时后', '一天后', '本周五'], weekday: '', next_zhuifang_day: 0, zhuifang_time:0, startdate:0, enddate:0, } onLoad: function (options) { let tomdate = util.tomorrowDate(new Date()) //明天 let startdate = util.formatDate(new Date()) //今天 let enddate = util.endYear(new Date()) //今年+30年 this.setData({ startdate: startdate, enddate: enddate, next_zhuifang_day: tomdate, zhuifang_time: '12:00', }) let today = util.getWeek(this.data.next_zhuifang_day) this.setData({ weekday: today, }) }, areatanxx: function () { this.setData({ istextarea: 0, isaddzhuifang: 0, }) }, zhfareainp: function (e) { this.setData({ zfang_log: e.detail.value, }) }, // 下次追访时间 zfselkj: function (e) { let zfselidx = e.currentTarget.dataset.index let zfdaytime = new Date(this.data.next_zhuifang_day + ' ' + this.data.zhuifang_time) //日期时间 console.log(zfdaytime.getTime()) console.log(zfdaytime.getTime() / 1000) zfdaytime = parseInt(zfdaytime.getTime() / 1000) //转为时间戳 秒 // let zftime, zfday if (zfselidx == 0) { // console.log(zfdaytime) zfdaytime = zfdaytime + 6 * 3600 zfdaytime = new Date(zfdaytime * 1000) //转为时间戳 // console.log(zfdaytime) this.setData({ next_zhuifang_day: util.formatDate(zfdaytime), zhuifang_time: util.formatTime(zfdaytime), weekday: util.getWeek(util.formatDate(zfdaytime)), }) } else if (zfselidx == 1) { zfdaytime = zfdaytime + 24 * 3600 zfdaytime = new Date(zfdaytime * 1000) //转为时间戳 // console.log(zfdaytime) this.setData({ next_zhuifang_day: util.formatDate(zfdaytime), zhuifang_time: util.formatTime(zfdaytime), weekday: util.getWeek(util.formatDate(zfdaytime)), }) } else if (zfselidx == 2) { if (this.data.weekday == '星期一') { zfdaytime = zfdaytime + 24 * 3600 * 4 zfdaytime = new Date(zfdaytime * 1000) //转为时间戳 // console.log(zfdaytime) this.setData({ next_zhuifang_day: util.formatDate(zfdaytime), zhuifang_time: util.formatTime(zfdaytime), weekday: util.getWeek(util.formatDate(zfdaytime)), }) } else if (this.data.weekday == '星期二') { zfdaytime = zfdaytime + 24 * 3600 * 3 zfdaytime = new Date(zfdaytime * 1000) //转为时间戳 // console.log(zfdaytime) this.setData({ next_zhuifang_day: util.formatDate(zfdaytime), zhuifang_time: util.formatTime(zfdaytime), weekday: util.getWeek(util.formatDate(zfdaytime)), }) } else if (this.data.weekday == '星期三') { zfdaytime = zfdaytime + 24 * 3600 * 2 zfdaytime = new Date(zfdaytime * 1000) //转为时间戳 // console.log(zfdaytime) this.setData({ next_zhuifang_day: util.formatDate(zfdaytime), zhuifang_time: util.formatTime(zfdaytime), weekday: util.getWeek(util.formatDate(zfdaytime)), }) } else if (this.data.weekday == '星期四') { zfdaytime = zfdaytime + 24 * 3600 * 1 zfdaytime = new Date(zfdaytime * 1000) //转为时间戳 // console.log(zfdaytime) this.setData({ next_zhuifang_day: util.formatDate(zfdaytime), zhuifang_time: util.formatTime(zfdaytime), weekday: util.getWeek(util.formatDate(zfdaytime)), }) } else { wx.showToast({ title: '不能选择以前的日期!', icon: 'none', }) } } }, bindDateChange: function (e) { this.setData({ next_zhuifang_day: e.detail.value, }) let today = util.getWeek(this.data.next_zhuifang_day) // console.log(today); this.setData({ weekday: today, }) // this.onweekday(this.data.next_zhuifang_day); // console.log(this.data.next_zhuifang_day) }, bindTimeChange: function (e) { this.setData({ zhuifang_time: e.detail.value, }) console.log(this.data.zhuifang_time) }, })

css:(less)

.addloupantan { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); z-index: 9; .addmain { position: absolute; top: 50%; left: 50%; width: 600rpx; height: 400rpx; padding: 30rpx; box-sizing: border-box; background: #fff; border-radius: 10rpx; margin: -300rpx 0 0 -300rpx; .zhuifangbox { position: relative; .inptxt { width: 100%; height: 80rpx; line-height: 80rpx; margin-top: 10rpx; font-size: 32rpx; color: #353535; } .areabox { display: block; padding: 10rpx; width: 100%; height: 142rpx; box-sizing: border-box; border: 1px solid #eee; border-radius: 10rpx; line-height: 40rpx; margin-top: 10rpx; font-size: 28rpx; color: #353535; } } .zhuibomtxt { display: flex; flex-direction: row; width: 100%; height: 80rpx; line-height: 80rpx; margin-top: 10rpx; font-size: 32rpx; color: #888; .select { width: 200rpx; margin-left: 10rpx; text-align: center; border-bottom: 1px solid #eee; } .smselect { width: 120rpx; } .bomnone { border-bottom: none; } } .nextzhfkjbox { align-items: center; .select { position: relative; width: auto; padding: 0 20rpx; height: 52rpx; overflow: hidden; border: 1px solid @red; font-size: 28rpx; line-height: 50rpx; color: @red; text-align: center; margin-right: 22rpx; border-radius: 10rpx; box-sizing: border-box; display: flex; flex-direction: row; align-items: center; justify-content: space-around; } } .addxx { position: absolute; right: 30rpx; top: 30rpx; width: 25rpx; height: 25rpx; overflow: hidden; z-index: 2 } .addtit { font-size: 34rpx; line-height: 80rpx; // border-bottom: 1px solid #eee; } .addinp { width: 100%; height: 80rpx; padding: 0 20rpx; box-sizing: border-box; font-size: 30rpx; line-height: 80rpx; margin-top: 40rpx; border-bottom: 1px solid #eee; } .addqueding { width: 200rpx; height: 80rpx; background: @red; font-size: 34rpx; color: #fff; text-align: center; line-height: 80rpx; border-radius: 10rpx; margin: 50rpx auto 0; } } .xiangcetan { width: 100%; height: 100%; top: 0; left: 0; padding: 140rpx 0 100rpx 0; margin: 0; background: none; border-radius: 0; .addxx { position: fixed; top: 50rpx; left: 50rpx; right: 0; width: 60rpx; height: 60rpx; } .xiangcesw { position: relative; width: 100%; height: 100%; overflow: hidden; .swiper-slide { position: relative; width: 100%; height: 100%; line-height: 100%; text-align: center; -webkit-box-flex: 1; display: table-cell; vertical-align: middle; .wximg { display: inline; max-width: 100%; max-height: 90%; } } } .xiangcepage { position: absolute; width: 100rpx; // background:#222; right: 20rpx; bottom: 0; height: 100rpx; line-height: 100rpx; font-size: 30rpx; color: #fff; } } }

 

 

选项时间计算讲解:

let zfselidx = e.currentTarget.dataset.index let zfdaytime = new Date(this.data.next_zhuifang_day + ' ' + this.data.zhuifang_time) //日期时间 console.log(zfdaytime.getTime()) console.log(zfdaytime.getTime() / 1000) zfdaytime = parseInt(zfdaytime.getTime() / 1000) //转为时间戳 秒 // console.log(zfdaytime) zfdaytime = zfdaytime + 6 * 3600 zfdaytime = new Date(zfdaytime * 1000) //转为时间戳 // console.log(zfdaytime) this.setData({ next_zhuifang_day: util.formatDate(zfdaytime), zhuifang_time: util.formatTime(zfdaytime), weekday: util.getWeek(util.formatDate(zfdaytime)), })

将当前选择的时间 转成时间戳后 再相应的计算 ,之后,再转回时间,对应的赋值便可。

最新回复(0)