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高级程序设计(第3版)学习笔记6 初识js对象
Oct 11 Javascript
JavaScript使用ActiveXObject访问Access和SQL Server数据库
Apr 02 Javascript
用JavaScript来美化HTML的select标签的下拉列表效果
Nov 17 Javascript
学习使用grunt来打包JavaScript和CSS程序的教程
Jan 04 Javascript
BootStrap下jQuery自动完成的样式调整
May 30 Javascript
js 基础篇必看(点击事件轮播图的简单实现)
Aug 20 Javascript
老生常谈的跨域处理
Jan 11 Javascript
JavaScript 对引擎、运行时、调用堆栈的概述理解
Oct 22 Javascript
利用d3.js力导布局绘制资源拓扑图实例教程
Jan 08 Javascript
vueScroll实现移动端下拉刷新、上拉加载
Mar 22 Javascript
vue 使用高德地图vue-amap组件过程解析
Sep 07 Javascript
用Golang运行JavaScript的实现示例
Nov 25 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
Laravel实现构造函数自动依赖注入的方法
2016/03/16 PHP
thinkPHP实现的省市区三级联动功能示例
2017/05/05 PHP
PHP绕过open_basedir限制操作文件的方法
2018/06/10 PHP
php用xpath解析html的代码实例讲解
2019/02/14 PHP
图片放大镜jquery.jqzoom.js使用实例附放大镜图标
2014/06/19 Javascript
jQuery html()方法使用不了无法显示内容的问题
2014/08/06 Javascript
Javascript中call与apply的学习笔记
2014/09/22 Javascript
JavaScript实现数组在指定位置插入若干元素的方法
2015/04/06 Javascript
通过jquery-ui中的sortable来实现拖拽排序的简单实例
2016/05/24 Javascript
AngularJS中的API(接口)简单实现
2016/07/28 Javascript
JavaScript与JQUERY获取元素的宽、高和位置
2017/02/26 Javascript
vue指令以及dom操作详解
2017/03/04 Javascript
NodeJS实现视频转码的示例代码
2017/11/18 NodeJs
vue+vue-router转场动画的实例代码
2018/09/01 Javascript
Vue使用Canvas绘制图片、矩形、线条、文字,下载图片
2019/04/26 Javascript
在Vue中使用this.$store或者是$route一直报错的解决
2019/11/08 Javascript
Vue中使用Lodop插件实现打印功能的简单方法
2019/12/19 Javascript
解决vue scoped html样式无效的问题
2020/10/24 Javascript
python基础教程之序列详解
2014/08/29 Python
Python中encode()方法的使用简介
2015/05/18 Python
Python进阶之递归函数的用法及其示例
2018/01/31 Python
Windows 7下Python Web环境搭建图文教程
2018/03/20 Python
详解Python3注释知识点
2019/02/19 Python
Pycharm自带Git实现版本管理的方法步骤
2020/09/18 Python
澳大利亚工具仓库:Tools Warehouse
2018/10/15 全球购物
缓解脚、腿和背部疼痛:Z-CoiL鞋
2019/03/12 全球购物
C#实现启动一个进程
2016/10/01 面试题
高中生毕业自我鉴定
2013/10/10 职场文书
家长通知书家长评语
2014/04/17 职场文书
旅游节目策划方案
2014/05/26 职场文书
村主任群众路线个人对照检查材料
2014/09/26 职场文书
小学生优秀评语
2014/12/29 职场文书
2015年大学生社会实践评语
2015/03/26 职场文书
奖励申请报告范文
2015/05/15 职场文书
创业计划书之密室逃脱
2019/11/08 职场文书
Pytorch中Softmax和LogSoftmax的使用详解
2021/06/05 Python