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 相关文章推荐
js判断横竖屏及禁止浏览器滑动条示例
Apr 29 Javascript
JS来动态的修改url实现对url的增删查改
Sep 05 Javascript
原生JS实现旋转木马式图片轮播插件
Apr 25 Javascript
PhotoSwipe异步动态加载图片方法
Aug 25 Javascript
js制作网站首页图片轮播特效代码
Aug 30 Javascript
Dropzone.js实现文件拖拽上传功能(附源码下载)
Nov 22 Javascript
解决canvas画布使用fillRect()时高度出现双倍效果的问题
Aug 03 Javascript
浅谈VUE监听窗口变化事件的问题
Feb 24 Javascript
AngularJs1.x自定义指令独立作用域的函数传入参数方法
Oct 09 Javascript
微信小程序webview 脚手架使用详解
Jul 22 Javascript
使用vue-cli4.0快速搭建一个项目的方法步骤
Dec 04 Javascript
node.js如何操作MySQL数据库
Oct 29 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简单防盗链验证实现方法
2016/07/09 PHP
老生常谈PHP面向对象之标识映射
2017/06/21 PHP
CakePHP框架Model关联对象用法分析
2017/08/04 PHP
FF IE浏览器修改标签透明度的方法
2014/01/27 Javascript
基于JavaScript实现仿京东图片轮播效果
2015/11/06 Javascript
浅谈javascript中的数据类型转换
2016/12/27 Javascript
js实现交通灯效果
2017/01/13 Javascript
Node.js的Koa实现JWT用户认证方法
2018/05/05 Javascript
Vue开发实现吸顶效果的示例代码
2018/08/21 Javascript
JavaScript剩余操作符Rest Operator详解
2019/07/20 Javascript
vue 输入电话号码自动按3-4-4分割功能的实现代码
2020/04/30 Javascript
js+css实现全屏侧边栏
2020/06/16 Javascript
JavaScript this关键字指向常用情况解析
2020/09/02 Javascript
[01:16]2014DOTA2 TI专访C9战队EE:中国五强中会占三席
2014/07/10 DOTA
彻底搞懂Python字符编码
2018/01/23 Python
python2.7使用plotly绘制本地散点图和折线图
2019/04/02 Python
pyqt实现.ui文件批量转换为对应.py文件脚本
2019/06/19 Python
python3.6 tkinter实现屏保小程序
2019/07/30 Python
Python利用逻辑回归模型解决MNIST手写数字识别问题详解
2020/01/14 Python
tensorflow指定CPU与GPU运算的方法实现
2020/04/21 Python
Python字符串split及rsplit方法原理详解
2020/06/29 Python
python3爬虫中多线程进行解锁操作实例
2020/11/25 Python
用CSS3将你的设计带入下个高度
2009/08/08 HTML / CSS
手工制作的音乐盒:Music Box Attic
2019/09/05 全球购物
SQL SERVER面试资料
2013/03/30 面试题
大学教师年终总结的自我评价
2013/10/29 职场文书
财务会计人员求职的自我评价
2014/01/13 职场文书
酒店行政人事部经理职务说明书
2014/02/26 职场文书
医疗纠纷协议书
2014/04/16 职场文书
志愿者活动总结报告
2014/06/27 职场文书
党的群众路线对照检查材料
2014/08/27 职场文书
党员个人查摆剖析材料
2014/10/16 职场文书
2015年度公共机构节能工作总结
2015/05/26 职场文书
公文写作:工伤事故分析报告怎么写?
2019/11/05 职场文书
总结Python连接CS2000的详细步骤
2021/06/23 Python
SQL实现LeetCode(175.联合两表)
2021/08/04 MySQL