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 相关文章推荐
js函数的延迟加载实现代码
Oct 11 Javascript
js实现幻灯片播放图片示例代码
Nov 07 Javascript
jQuery中bind,live,delegate与one方法的用法及区别解析
Dec 30 Javascript
js实现表格字段排序
Feb 19 Javascript
jquery 取子节点及当前节点属性值的方法
Aug 24 Javascript
javascript获取当前鼠标坐标的方法
Jan 10 Javascript
基于jquery实现动态竖向柱状条特效
Feb 12 Javascript
详解VueJs异步动态加载块
Mar 09 Javascript
解决VUEX兼容IE上的报错问题
Mar 01 Javascript
jquery ajax加载数据前台渲染方式 不用for遍历的方法
Aug 09 jQuery
iview Upload组件多个文件上传的示例代码
Sep 30 Javascript
微信小程序获取复选框全选反选选中的值(实例代码)
Dec 17 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
收音机怀古---春雷3P7图片欣赏
2021/03/02 无线电
967 个函式
2006/10/09 PHP
PHP中的extract的作用分析
2008/04/09 PHP
php读取富文本的时p标签会出现红线是怎么回事
2014/05/13 PHP
Thinkphp无限级分类代码
2015/11/11 PHP
PHP实现递归目录的5种方法
2016/10/27 PHP
PHP用mysql_insert_id()函数获得刚插入数据或当前发布文章的ID
2016/11/25 PHP
基于laravel belongsTo使用详解
2019/10/18 PHP
javascript得到XML某节点的子节点个数的脚本
2008/10/11 Javascript
Ext.get() 和 Ext.query()组合使用实现最灵活的取元素方式
2011/09/26 Javascript
js中的时间转换—毫秒转换成日期时间的示例代码
2014/01/26 Javascript
jquery事件preventDefault()方法用法实例
2015/01/16 Javascript
javascript模拟命名空间
2015/04/17 Javascript
jquery-tips悬浮提示插件分享
2015/07/31 Javascript
Jquery Ajax Error 调试错误的技巧
2015/11/20 Javascript
深入探究AngularJS框架中Scope对象的超级教程
2016/01/04 Javascript
浅谈JavaScript的全局变量与局部变量
2016/06/10 Javascript
js简单实现调整网页字体大小的方法
2016/07/23 Javascript
浅谈EasyUI常用控件的禁用方法
2016/11/09 Javascript
基于JavaScript实现自动更新倒计时效果
2016/12/19 Javascript
js实现下拉菜单效果
2017/03/01 Javascript
微信小程序网络请求wx.request详解及实例
2017/05/18 Javascript
详解如何使用vue-cli脚手架搭建Vue.js项目
2017/05/19 Javascript
JS实现多张图片预览同步上传功能
2017/06/23 Javascript
node文件批量重命名的方法示例
2017/10/23 Javascript
在layui下对元素进行事件绑定的实例
2019/09/06 Javascript
js实现弹幕墙效果
2020/12/10 Javascript
Python中str.join()简单用法示例
2018/03/20 Python
如何将 awk 脚本移植到 Python
2019/12/09 Python
Python通过socketserver处理多个链接
2020/03/18 Python
纯HTML5+CSS3制作生日蛋糕代码
2016/11/16 HTML / CSS
澳大利亚制造的蜡烛和扩散器:Glasshouse Fragrances
2018/05/20 全球购物
初二学习计划书范文
2014/04/27 职场文书
2015年新农村建设指导员工作总结
2015/07/24 职场文书
react antd实现动态增减表单
2021/06/03 Javascript
SQL Server使用CROSS APPLY与OUTER APPLY实现连接查询
2022/05/25 SQL Server