layui中table表头样式修改方法


Posted in Javascript onAugust 15, 2018

如下所示:

layui.use('table', function () {
 var table = layui.table;
 
 table.render({
  elem: '#desTable'
  , url: '${ctx}/alarm/queryEventShowScatter'
  , even: true
  , page: { //支持传入 laypage 组件的所有参数(某些参数除外,如:jump/elem) - 详见文档
  layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
  //,curr: 5 //设定初始在第 5 页
  , groups: 1 //只显示 1 个连续页码
  , first: false //不显示首页
  , last: false //不显示尾页
 
  }
  , cols: [[
  {field: 'id', width: '15%', title: '1', style: 'background-color: #5FB878; color: #fff'}
  , {field: 'srcip', width: '15%', title: '2', style: 'background-color: #5FB878; color: #fff'}
  , {field: 'logtime', width: '20%', title: '3', style: 'background-color: #5FB878; color: #fff'}
  , {field: 'lasttime', width: '20%', title: '4', style: 'background-color: #5FB878; color: #fff'}
  , {field: 'count', width: '15%', title: '5', style: 'background-color: #5FB878; color: #fff'}
  , {field: 'percent', width: '15%', title: '6', style: 'background-color: #5FB878; color: #fff'}
  ]],
  done: function (res, curr, count) {
  $('tr').css({'background-color': '#009688', 'color': '#fff'});
  }
 
 });
 });

done:function()方法在加载完成时回调,用jquery修改样式。

以上这篇layui中table表头样式修改方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
动态获取复选框checkbox选中个数的jquery代码
Jun 25 Javascript
js实例属性和原型属性示例详解
Nov 23 Javascript
JavaScript让Textarea支持tab按键的方法
Jun 26 Javascript
js图片轮播手动切换效果
Nov 10 Javascript
JavaScript学习笔记之检测客户端类型是(引擎、浏览器、平台、操作系统、移动设备)
Dec 03 Javascript
Laravel中常见的错误与解决方法小结
Aug 30 Javascript
js改变html的原有内容实现方法
Oct 05 Javascript
vue.js实现请求数据的方法示例
Feb 07 Javascript
JQuery.dataTables表格插件添加跳转到指定页
Jun 09 jQuery
Vue.js项目部署到服务器的详细步骤
Jul 17 Javascript
详解jquery选择器的原理
Aug 01 jQuery
在vue中更换字体,本地存储字体非引用在线字体库的方法
Sep 28 Javascript
详解redux异步操作实践
Aug 15 #Javascript
解决Layui数据表格中checkbox位置不居中的方法
Aug 15 #Javascript
Bootstrap Table列宽拖动的方法
Aug 15 #Javascript
浅谈微信JS-SDK 微信分享接口开发(介绍版)
Aug 15 #Javascript
layui结合form,table的全选、反选v1.0示例讲解
Aug 15 #Javascript
详解微信JS-SDK选择图片遇到的坑
Aug 15 #Javascript
解决layui中的form表单与button的点击事件冲突问题
Aug 15 #Javascript
You might like
PHP include_path设置技巧分享
2011/07/03 PHP
请离开include_once和require_once
2013/07/18 PHP
php中如何使对象可以像数组一样进行foreach循环
2013/08/09 PHP
PHP实现的Redis多库选择功能单例类
2017/07/27 PHP
PHP二维索引数组的遍历实例分析【2种方式】
2019/06/24 PHP
分享10篇优秀的jQuery幻灯片制作教程及应用案例
2011/04/16 Javascript
Javascript 面向对象(一)(共有方法,私有方法,特权方法)
2012/05/23 Javascript
jquery的flexigrid无法显示数据提示获取到数据
2013/07/19 Javascript
原生JavaScript实现连连看游戏(附源码)
2013/11/05 Javascript
jquery 自定义容器下雨效果可将下雨图标改为其他
2014/04/23 Javascript
Javascript 数组排序详解
2014/10/22 Javascript
javascript中return,return true,return false三者的用法及区别
2015/11/17 Javascript
浅析JS原型继承与类的继承
2016/04/07 Javascript
vue实现某元素吸顶或固定位置显示(监听滚动事件)
2017/12/13 Javascript
vue2.0安装style/css loader的方法
2018/03/14 Javascript
Vue 开发音乐播放器之歌手页右侧快速入口功能
2018/08/08 Javascript
在Vuex使用dispatch和commit来调用mutations的区别详解
2018/09/18 Javascript
微信小程序实现简单评论功能
2018/11/28 Javascript
jQuery利用cookie 实现本地收藏功能(不重复无需多次命名)
2019/11/07 jQuery
webpack3.0升级4.0的方法步骤
2020/04/02 Javascript
如何在vue中使用jointjs过程解析
2020/05/29 Javascript
[37:47]IG vs Winstrike 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
pyqt5 键盘监听按下enter 就登陆的实例
2019/06/25 Python
python画图把时间作为横坐标的方法
2019/07/07 Python
安装Pycharm2019以及配置anconda教程的方法步骤
2019/11/11 Python
Python中的引用和拷贝实例解析
2019/11/14 Python
Python3 中作为一等对象的函数解析
2019/12/11 Python
Python3标准库之dbm UNIX键-值数据库问题
2020/03/24 Python
英国奢侈品概念店:Base Blu
2019/05/16 全球购物
莫斯科的韩国化妆品店:Sifo
2019/12/04 全球购物
Lungolivigno Fashion官网:高级时装在线购物
2020/10/17 全球购物
幼儿教师自我鉴定
2013/11/02 职场文书
优秀团支部事迹材料
2014/02/08 职场文书
节约用水演讲稿
2014/05/21 职场文书
logback如何自定义日志存储
2021/08/30 Java/Android
利用JuiceFS使MySQL 备份验证性能提升 10 倍
2022/03/17 MySQL