layui前端时间戳转化实例


Posted in Javascript onNovember 15, 2019

1、html : 添加一个table,用来显示数据

<table class="layui-table" id="list" lay-filter="manageEvent"></table>

2、js部分 :接收后台传来的数据

layui.use(['laypage', 'layer','element','table','form'], function(){
   var laypage = layui.laypage;
   var layer = layui.layer;
   var element = layui.element;
   var table = layui.table;
   var form = layui.form;
   
   table.render({
    elem: '#list',
    url: '${path}/manage/selectManageList', //数据接口,
    page: false, //开启分页
    cols: [[ //表头
     {field: 'manageId', title: 'ID', sort: true, fixed: 'left',align:"center"},
     {field: 'phone', title: '手机号码',align:"center"},
     {field: 'mrtRoleName', title: '身份',align:"center"},
     {field: 'loginTime', title: '最后登入时间',align:"center",templet: '#loginTime'},
     {field: 'status', title: '状态',templet: '#statusTpl',align:"center"},
     {field:'status', title:'操作', toolbar: '#barDemo',templet:"#statusEdit",unresize: true,align:"center"}
    ]]

 });

3、引进 :

<script type="text/html" id="loginTime"> 

 {{ dateFormat(d.loginTime) }} // d是layui自带的
</script>

layui前端时间戳转化实例

4、引入下面JS代码,可以刚在公共的JS文件里面

/* 时间戳转化开始 */
  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), //q是季度
    "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; 
  } 
  
  String.prototype.format = function (args) { 
   var result = this; 
   if (arguments.length > 0) { 
    if (arguments.length == 1 && typeof (args) == "loginTime") { 
     for (var key in args) { 
      if (args[key] != undefined) { 
       var reg = new RegExp("({" + key + "})", "g"); 
       result = result.replace(reg, args[key]); 
      } 
     } 
    } 
    else { 
     for (var i = 0; i < arguments.length; i++) { 
      if (arguments[i] != undefined) { 
       //var reg = new RegExp("({[" + i + "]})", "g");//这个在索引大于9时会有问题 
       var reg = new RegExp("({)" + i + "(})", "g"); 
       result = result.replace(reg, arguments[i]); 
      } 
     } 
    } 
   } 
   return result; 
  }
  function dateFormat(value) {
   return value ? new Date(value*1000).format("yyyy-MM-dd hh:mm:ss") : ""; 
  }

值得注意的是:value值,毫秒还是秒;我这里的value是毫秒所以乘了1000

/* 时间戳转化结束

layui前端时间戳转化实例

以上这篇layui前端时间戳转化实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript使用onclick事件改变选中行的颜色
Dec 30 Javascript
构造函数+原型模式构造js自定义对象(最通用)
May 12 Javascript
Javascript基础教程之switch语句
Jan 18 Javascript
JavaScript实现数组随机排序的方法
Jun 26 Javascript
【经典源码收藏】jQuery实用代码片段(筛选,搜索,样式,清除默认值,多选等)
Jun 07 Javascript
JavaScript编程中实现对象封装特性的实例讲解
Jun 24 Javascript
JS验证全角与半角及相互转化的介绍
May 18 Javascript
JavaScript模拟实现自由落体效果
Aug 28 Javascript
Vue唯一可以更改vuex实例中state数据状态的属性对象Mutation的讲解
Jan 18 Javascript
Vue 实例事件简单示例
Sep 19 Javascript
Vue插件之滑动验证码用法详解
Apr 05 Javascript
JavaScript位置参数实现原理及过程解析
Sep 14 Javascript
JavaScript变量基本使用方法实例分析
Nov 15 #Javascript
JavaScript字符串处理常见操作方法小结
Nov 15 #Javascript
layui数据表格重载实现往后台传参
Nov 15 #Javascript
JS实现贪吃蛇游戏
Nov 15 #Javascript
Layui表格监听行单双击事件讲解
Nov 14 #Javascript
layui table表格数据的新增,修改,删除,查询,双击获取行数据方式
Nov 14 #Javascript
解决Layui数据表格显示无数据提示的问题
Nov 14 #Javascript
You might like
php获取字段名示例分享
2014/03/03 PHP
php使用ob_start()实现图片存入变量的方法
2014/11/14 PHP
浅析php设计模式之数据对象映射模式
2016/03/03 PHP
Laravel访问出错提示:`Warning: require(/vendor/autoload.php): failed to open stream: No such file or di解决方法
2019/04/02 PHP
B/S开发中常用javaScript技术与代码
2007/03/09 Javascript
在JavaScript的jQuery库中操作AJAX的方法讲解
2015/08/15 Javascript
js验证身份证号有效性并提示对应信息
2015/10/19 Javascript
TypeScript Type Innference(类型判断)
2016/03/10 Javascript
深入理解js函数的作用域与this指向
2016/05/28 Javascript
AngularJS 指令的交互详解及实例代码
2016/09/14 Javascript
javascript的document中的动态添加标签实现方法
2016/10/24 Javascript
jQuery编写设置和获取颜色的插件
2017/01/09 Javascript
zTree节点文字过多的处理方法
2017/11/24 Javascript
JS实现的汉字与Unicode码相互转化功能分析
2018/05/25 Javascript
vue使用中的内存泄漏【推荐】
2018/07/10 Javascript
原生JS实现的简单轮播图功能【适合新手】
2018/08/17 Javascript
nodejs中实现用户注册路由功能
2019/05/20 NodeJs
javascript关于“时间”的一次探索
2019/07/24 Javascript
[05:48]DOTA2英雄梦之声vol21 屠夫
2014/06/20 DOTA
Python的Tornado框架实现图片上传及图片大小修改功能
2016/06/30 Python
Python3中简单的文件操作及两个简单小实例分享
2017/06/18 Python
对python中执行DOS命令的3种方法总结
2018/05/12 Python
Python制作动态字符图的实例
2019/01/27 Python
Scrapy-Redis结合POST请求获取数据的方法示例
2019/05/07 Python
Tensorflow安装问题: Could not find a version that satisfies the requirement tensorflow
2020/04/20 Python
HTML5 LocalStorage 本地存储详细概括(多图)
2017/08/18 HTML / CSS
html5.2 dialog简介详解
2018/02/27 HTML / CSS
Myprotein意大利官网:欧洲第一运动营养品牌
2018/11/22 全球购物
西班牙用户之间买卖视频游戏的平台:Wakkap
2020/03/21 全球购物
Ibatis中如何提高SQL Map的性能
2013/05/11 面试题
班级年度安全计划书
2014/05/01 职场文书
企业消防安全责任书
2014/07/23 职场文书
年会邀请函范文
2015/01/30 职场文书
司机个人年终总结
2015/03/03 职场文书
《秋天的怀念》教学反思
2016/02/17 职场文书
Mysql数据库值的添加、修改、删除及清空操作实例
2021/06/20 MySQL