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 相关文章推荐
基于jQuery的获取标签名的代码
Jul 16 Javascript
推荐40个简单的 jQuery 导航插件和教程(下篇)
Sep 14 Javascript
复制js对象方法(详解)
Jul 08 Javascript
Html5的placeholder属性(IE兼容)实现代码
Aug 30 Javascript
jQuery实现图片轮播效果代码(基于jquery.pack.js插件)
Jun 02 Javascript
jQuery实现一个简单的验证码功能
Jun 26 jQuery
5分钟打造简易高效的webpack常用配置
Jul 04 Javascript
解决iview打包时UglifyJs报错的问题
Mar 07 Javascript
vue js秒转天数小时分钟秒的实例代码
Aug 08 Javascript
js实现鼠标拖拽div左右滑动
Jan 15 Javascript
Vue 请求传公共参数的操作
Jul 31 Javascript
Vue elementui字体图标显示问题解决方案
Aug 18 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
PHP 多进程 解决难题
2009/06/22 PHP
php win下Socket方式发邮件类
2009/08/21 PHP
php目录操作函数之获取目录与文件的类型
2010/12/29 PHP
PHP与MYSQL中UTF8 中文排序示例代码
2014/10/23 PHP
CentOS下与Apache连接的PHP多版本共存方案实现详解
2015/12/19 PHP
浅谈laravel中的关联查询with的问题
2019/10/10 PHP
javascript页面动态显示时间变化示例代码
2013/12/18 Javascript
JQuery的$命名冲突详细解析
2013/12/28 Javascript
jQuery 中国省市两级联动选择附图
2014/05/14 Javascript
JavaScript表格常用操作方法汇总
2015/04/15 Javascript
jQuery中的一些常见方法小结(推荐)
2016/06/13 Javascript
js实现统计字符串中特定字符出现个数的方法
2016/08/02 Javascript
使用requirejs模块化开发多页面一个入口js的使用方式
2017/06/14 Javascript
vue 修改 data 数据问题并实时显示的方法
2018/08/27 Javascript
详解Vue 项目中的几个实用组件(ts)
2019/10/29 Javascript
构建大型 Vue.js 项目的10条建议(小结)
2019/11/14 Javascript
node.js 如何监视文件变化
2020/09/01 Javascript
50行代码实现贪吃蛇(具体思路及代码)
2013/04/27 Python
Python机器学习之scikit-learn库中KNN算法的封装与使用方法
2018/12/14 Python
Python类装饰器实现方法详解
2018/12/21 Python
详解django+django-celery+celery的整合实战
2019/03/19 Python
浅谈Python类中的self到底是干啥的
2019/11/11 Python
Pycharm debug调试时带参数过程解析
2020/02/03 Python
只要五步 就可以用HTML5/CSS3快速制作便签贴特效(图)
2012/06/04 HTML / CSS
Ray-Ban雷朋太阳眼镜英国官网:Ray-Ban UK
2019/11/23 全球购物
实习教师自我鉴定
2013/09/27 职场文书
精彩的推荐信范文
2013/11/26 职场文书
《晏子使楚》教学反思
2014/02/08 职场文书
省文明单位申报材料
2014/05/08 职场文书
自强自立美德少年事迹材料
2014/08/16 职场文书
学校元旦晚会开场白
2014/12/14 职场文书
长江三峡导游词
2015/01/31 职场文书
小区环境卫生倡议书
2015/04/29 职场文书
党内外群众意见范文
2015/06/02 职场文书
《草船借箭》教学反思
2016/02/23 职场文书
Vue接口封装的完整步骤记录
2021/05/14 Vue.js