微信小程序实现日期格式化和倒计时


Posted in Javascript onNovember 01, 2020

本文实例为大家分享了微信小程序实现日期格式化和倒计时的具体代码,供大家参考,具体内容如下

首先看看日期怎么格式化

第一种:

Date.prototype.Format = function (fmt) { //author: meizz 
 var o = {
 "M+": this.getMonth() + 1, //月份 
 "d+": this.getDate(), //日 
 "h+": this.getHours(), //小时 
 "m+": this.getMinutes(), //分 
 "s+": this.getSeconds(), //秒 
 "q+": Math.floor((this.getMonth() + 3) / 3), //季度 
 "S": this.getMilliseconds() //毫秒 
 };
 if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
 for (var k in o)
 if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
 return fmt;
 
}

然后是调用this.value1=new Date().Format("yyyy-MM-dd HH:MM:SS")

第二种

1.中国标准时间格式化:

formatDateTime:function(theDate) {
 var _hour = theDate.getHours();
 var _minute = theDate.getMinutes();
 var _second = theDate.getSeconds();
 var _year = theDate.getFullYear()
 var _month = theDate.getMonth();
 var _date = theDate.getDate();
 if (_hour < 10) { _hour ="0" + _hour }
 if (_minute < 10) { _minute = "0" + _minute }
 if (_second < 10) { _second = "0" + _second }
 _month = _month + 1
 if (_month < 10) { _month = "0" + _month; }
 if (_date < 10) { _date ="0" + _date }
 var time= _year + "-" + _month + "-" + _date + " " + _hour + ":" + _minute + ":" + 
 _second;
// var time = new Date();
// var formatTime = formatDateTime(time);
// 返回结果:
// Tue Jun 06 2017 15:31:09 GMT+ 0800(中国标准时间)
// 2017 - 06 - 06 15:31:09
//clock为在data中定义的空变量,存放转化好的日期
 this.setData({
 clock: time
 })
},

2、把格式化时间转换为毫秒数

var formatTimeS = new Date('2017-06-06 15:31:09').getTime();

返回结果:1496734269900

3、把毫秒数转换为标准时间

var formatTimeS = new Date(1496734269900);

返回结果:Tue Jun 06 201715:31:09 GMT+0800(中国标准时间)

二、实现倒计时

//倒计时:其中time_canshu为传入的毫秒数
date_format: function (time_canshu) {
 // let formatTime1 = new Date().getTime();
 // let formatTime2 = new Date('2018-04-24 15:31:09').getTime();
 // let formatTimeS = new Date(formatTime2 - formatTime1);
 var none = '00:00:00';
 if (formatTimeS<=0){
 this.setData({
 clock: none
 })} else {
 // 秒数
 letsecond = Math.floor(time_canshu / 1000);
 // 小时位
 lethr = Math.floor(second / 3600);
 // 分钟位
 letmin = Math.floor((second - hr * 3600) /60);
 // 秒位
 letsec = second % 60;// equal to => var sec = second % 60;
 if (hr <= 9) hr ='0' + hr;
 if (min <= 9) min ='0' + min;
 if (sec <= 9) sec ='0' + sec;
 lettime = hr + ":" + min + ":" + sec + " ";
 this.setData({
 clock: time
 })
 }
},

时间戳转化为日期格式函数

//时间戳转化为日期格式
function timestampToTime(timestamp) {
 var date = new Date(timestamp * 1000);//时间戳为10位需*1000,时间戳为13位的话不需乘1000
 var Y = date.getFullYear() + '-';
 var M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
 var D = date.getDate() + ' ';
 var h = date.getHours() + ':';
 var m = date.getMinutes() + ':';
 var s = date.getSeconds();
 return Y+M+D+h+m+s;
 }
 timestampToTime(1403058804);
 console.log(timestampToTime(1403058804));//2014-06-18 10:33:24
 
//日期格式转化为时间戳
var date = new Date('2014-04-23 18:55:49:123');
 // 有三种方式获取
 var time1 = date.getTime();
 var time2 = date.valueOf();
 var time3 = Date.parse(date);
 console.log(time1);//1398250549123
 console.log(time2);//1398250549123
 console.log(time3);//1398250549000
//以上三种获取方式的区别:第一、第二种:会精确到毫秒第三种:只能精确到秒,毫秒用000替代以上三个输出结果可观察其区别注意:获取到的时间戳除以1000就可获得Unix时间戳,就可传值给后台得到。

分/秒转化为天时分

secondToDate (result) {
 if (result > 60) {
 let d = parseInt(Math.floor(result / 86400))
 let h = d > 0? Math.floor((result - d * 86400) / 3600): Math.floor(result / 3600);
 let m = h > 0? Math.floor((result - d * 86400 - h * 3600) / 60): Math.floor(result / 60);
 return d + '天:' + h + '时:' + m + '分'
 } else {
 return result + '秒'
 }
 }

为大家推荐现在关注度比较高的微信小程序教程一篇:《微信小程序开发教程》小编为大家精心整理的,希望喜欢。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 动态table添加colspan\rowspan 参数的方法
Jul 25 Javascript
javascript窗口宽高,鼠标位置,滚动高度(详细解析)
Nov 18 Javascript
js网页实时倒计时精确到秒级
Feb 10 Javascript
基于javascript bootstrap实现生日日期联动选择
Apr 07 Javascript
Ionic 2 实现列表滑动删除按钮的方法
Jan 22 Javascript
全面解析vue中的数据双向绑定
May 10 Javascript
vue.js中父组件调用子组件的内部方法示例
Oct 22 Javascript
jQuery基于闭包实现的显示与隐藏div功能示例
Jun 09 jQuery
vue中如何实现后台管理系统的权限控制的方法示例
Sep 19 Javascript
JS 音频可视化插件Wavesurfer.js的使用教程
Oct 31 Javascript
vue动态注册组件实例代码详解
May 30 Javascript
layui table单元格事件修改值的方法
Sep 24 Javascript
微信小程序实现商城倒计时
Nov 01 #Javascript
微信小程序实现批量倒计时功能
Nov 01 #Javascript
微信小程序实现订单倒计时
Nov 01 #Javascript
Vue监听页面刷新和关闭功能
Jun 20 #Javascript
Vue 2.0 中依赖注入 provide/inject组合实战
Jun 20 #Javascript
js实现页面多个日期时间倒计时效果
Jun 20 #Javascript
vue实现绑定事件的方法实例代码详解
Jun 20 #Javascript
You might like
CI框架中libraries,helpers,hooks文件夹详细说明
2014/06/10 PHP
laravel 解决后端无法获取到前端Post过来的值问题
2019/10/22 PHP
原生js获取宽高与jquery获取宽高的方法关系对比
2014/04/04 Javascript
innerHTML动态添加html代码和脚本兼容多个浏览器
2014/10/11 Javascript
JavaScript 实现的 zip 压缩和解压缩工具包Zip.js使用详解
2015/12/14 Javascript
javascript中的作用域和闭包详解
2016/01/13 Javascript
原生JS实现风箱式demo,并封装了一个运动框架(实例代码)
2016/07/22 Javascript
AngularJS 2.0入门权威指南
2016/10/08 Javascript
解决AngualrJS页面刷新导致异常显示问题
2017/04/20 Javascript
react开发中如何使用require.ensure加载es6风格的组件
2017/05/09 Javascript
详解Vue-cli 创建的项目如何跨域请求
2017/05/18 Javascript
如何使用JS在HTML中自定义字符串格式化
2017/07/20 Javascript
jQuery实现腾讯信用界面(自制刻度尺)样式
2017/08/15 jQuery
全选复选框JavaScript编写小结(附代码)
2017/08/16 Javascript
使用JQuery实现图片轮播效果的实例(推荐)
2017/10/24 jQuery
vue用递归组件写树形控件的实例代码
2018/07/19 Javascript
element-ui 的el-button组件中添加自定义颜色和图标的实现方法
2018/10/26 Javascript
详解JavaScript原生封装ajax请求和Jquery中的ajax请求
2019/02/14 jQuery
移动端吸顶fixbar的解决方案详解
2019/07/17 Javascript
js 实现 list转换成tree的方法示例(数组到树)
2019/08/18 Javascript
Node.js系列之安装配置与基本使用(1)
2019/08/30 Javascript
jQuery实现滑动开关效果
2020/08/02 jQuery
[02:03]完美世界DOTA2联赛10月30日赛事集锦
2020/10/31 DOTA
Python多线程爬虫简单示例
2016/03/04 Python
详解将Django部署到Centos7全攻略
2018/09/26 Python
python 获取url中的参数列表实例
2018/12/18 Python
python命名空间(namespace)简单介绍
2019/08/10 Python
PIL包中Image模块的convert()函数的具体使用
2020/02/26 Python
html5中svg canvas和图片之间相互转化思路代码
2014/01/24 HTML / CSS
介绍一下sql server的安全性
2014/08/10 面试题
请解释一下webService? 如何用.net实现webService
2014/06/09 面试题
办理退休介绍信
2014/01/09 职场文书
学习方法演讲稿
2014/05/10 职场文书
奥巴马当选演讲稿
2014/09/10 职场文书
干部外出学习心得体会
2016/01/18 职场文书
MySQL解决Navicat设置默认字符串时的报错问题
2022/06/16 MySQL