JS根据Unix时间戳显示发布时间是多久前【项目实测】


Posted in Javascript onJuly 10, 2019

后台接口给的时间数据为Unix时间戳,我们的需求是显示类似微信朋友圈显示发布时间为距离当前时间多久之前,“xx分钟之前”,“xx小时之前”,“xx个月之前”。

类似这样的时间显示效果:

JS根据Unix时间戳显示发布时间是多久前【项目实测】

转换函数:

/**
 * Unix时间戳转换为当前时间多久之前
 * @param timespan int     Unix时间戳
 * @return timeSpanStr string   转换之后的前台需要的字符串
 */
function Ftime (timespan) {
  var dateTime = new Date(timespan * 1000);
  var year = dateTime.getFullYear();
  var month = dateTime.getMonth() + 1;
  var day = dateTime.getDate();
  var hour = dateTime.getHours();
  var minute = dateTime.getMinutes();
  //当前时间
  var now = Date.parse(new Date()); //typescript转换写法
  var milliseconds = 0;
  var timeSpanStr;
  //计算时间差
  milliseconds = (now / 1000) - timespan;

  //一分钟以内
  if (milliseconds <= 60) {
    timeSpanStr = '刚刚';
  }
  //大于一分钟小于一小时
  else if (60 < milliseconds && milliseconds <= 60 * 60) {
    timeSpanStr = Math.ceil((milliseconds / (60))) + '分钟前';
  }
  //大于一小时小于等于一天
  else if (60 * 60 < milliseconds && milliseconds <= 60 * 60 * 24) {
    timeSpanStr = Math.ceil(milliseconds / (60 * 60)) + '小时前';
  }
  //大于一天小于等于15天
  else if (60 * 60 * 24 < milliseconds && milliseconds <= 60 * 60 * 24 * 30) {
    timeSpanStr = Math.ceil(milliseconds / (60 * 60 * 24)) + '天前';
  }
  //大于一个月小于一年
  else if (60 * 60 * 24 * 30 < milliseconds && milliseconds <= 60 * 60 * 24 * 30 * 12){
    timeSpanStr = Math.ceil(milliseconds / (60 * 60 * 24 * 30)) + '个月前';
  }
  //超过一年显示
  else {
    timeSpanStr = year + '年' + month + '月' + day + '日 ' + hour + ':' + minute;  
  }
  return timeSpanStr;
}

总结

以上所述是小编给大家介绍的JS根据Unix时间戳显示发布时间是多久前 ,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
可以支持多中格式的JS键盘
May 02 Javascript
Js 弹出框口并返回值的两种常用方法
Dec 30 Javascript
用JavaScript获取DOM元素位置和尺寸大小的方法
Apr 12 Javascript
jquery利用ajax调用后台方法实例
Aug 23 Javascript
jquery 获取 outerHtml 包含当前节点本身的代码
Oct 30 Javascript
jQuery Checkbox 全选 反选的简单实例
Nov 29 Javascript
jquery处理checkbox(复选框)是否被选中实例代码
Jun 12 jQuery
在 Angular 中使用Chart.js 和 ng2-charts的示例代码
Aug 17 Javascript
详解Vue组件之间通信的七种方式
Apr 14 Javascript
微信小程序swiper左右扩展各显示一半代码实例
Dec 05 Javascript
js 将多个对象合并成一个对象 assign方法的实现
Sep 24 Javascript
react-intl实现React国际化多语言的方法
Sep 27 Javascript
JS把字符串格式的时间转换成几秒前、几分钟前、几小时前、几天前等格式
Jul 10 #Javascript
JS将时间秒转换成天小时分钟秒的字符串
Jul 10 #Javascript
js Array.slice的8种不同用法示例
Jul 10 #Javascript
vue-router二级导航切换路由及高亮显示的实现方法
Jul 10 #Javascript
Vue编程式跳转的实例代码详解
Jul 10 #Javascript
微信小程序在ios下Echarts图表不能滑动的问题解决
Jul 10 #Javascript
Vue事件修饰符native、self示例详解
Jul 09 #Javascript
You might like
ThinkPHP分页类使用详解
2014/03/05 PHP
php学习笔记之面向对象
2014/11/08 PHP
PHP 中 Orientation 属性判断上传图片是否需要旋转
2015/10/16 PHP
PHP载入图像imagecreatefrom_gif_jpeg_png系列函数用法分析
2016/11/14 PHP
PHP自定义序列化接口Serializable用法分析
2017/12/29 PHP
thinkphp3.2.0 setInc方法 源码全面解析
2018/01/29 PHP
Javascript动态绑定事件的简单实现代码
2010/12/25 Javascript
如何在一个页面显示多个百度地图
2013/04/07 Javascript
node.js实现多图片上传实例
2014/06/03 Javascript
JQuery显示隐藏DIV的方法及代码实例
2015/04/16 Javascript
js 中获取制定的cook信息实现方法
2016/11/19 Javascript
ES6(ECMAScript 6)新特性之模板字符串用法分析
2017/04/01 Javascript
Vue.js中轻松解决v-for执行出错的三个方案
2017/06/09 Javascript
JavaScript基本语法_动力节点Java学院整理
2017/06/26 Javascript
详解webpack2+node+react+babel实现热加载(hmr)
2017/08/24 Javascript
基于Nodejs的Tcp封包和解包的理解
2018/09/19 NodeJs
vue实现局部刷新的实现示例
2019/04/16 Javascript
vue实现滑动到底部加载更多效果
2020/10/27 Javascript
js实现计算器功能
2020/08/10 Javascript
Python基础之函数用法实例详解
2014/09/10 Python
Python中统计函数运行耗时的方法
2015/05/05 Python
python中函数总结之装饰器闭包详解
2016/06/12 Python
Python编程求解二叉树中和为某一值的路径代码示例
2018/01/04 Python
在Django中输出matplotlib生成的图片方法
2018/05/24 Python
python同时遍历数组的索引和值的实例
2018/11/15 Python
解决Python plt.savefig 保存图片时一片空白的问题
2019/01/10 Python
Python 从subprocess运行的子进程中实时获取输出的例子
2019/08/14 Python
学年自我鉴定范文
2013/10/01 职场文书
表扬信格式
2014/01/12 职场文书
酒店大堂副理的职责范文
2014/02/13 职场文书
物理学专业求职信
2014/07/04 职场文书
上班离岗检讨书
2014/09/10 职场文书
单位委托书格式范本
2014/09/29 职场文书
新农村建设指导员工作总结
2015/08/13 职场文书
浅谈Redis缓冲区机制
2022/06/05 Redis
python读取mat文件生成h5文件的实现
2022/07/15 Python