layui table+复杂表头+合并单元格

最新推荐文章于 2024-05-30 11:05:59 发布

dljm328963024

最新推荐文章于 2024-05-30 11:05:59 发布

阅读量3.3k

点赞数

文章标签： javascript matlab 前端 ViewUI

原文链接：http://www.cnblogs.com/zhinian-/p/11063168.html

版权

效果图：

问题：行hover效果感觉错乱所以改为透明色

代码：

  1 <!DOCTYPE html>
  2 <html lang="en">
  3 <head>
  4     <meta charset="UTF-8">
  5     <title>复杂表头+select下拉框默认值+单元格合并</title>
  6     <script src="../../../static/lib/layui/layui.js" charset="utf-8"></script>
  7     <style>
  8         /*select下拉框显示*/
  9         td[data-field="qualityStatus"]>div {
    
 10             overflow: inherit;
 11         }
 12         /*去除行点击、hover背景色*/
 13         .layui-table tbody tr:hover , .layui-table-hover , .layui-table-click{
    
 14             background-color: rgba(255,255,255,0);
 15         }
 16     </style>
 17 </head>
 18 <body>
 19     <div class="layui-fluid">
 20         <div class="layui-row layui-col-space15">
 21             <div class="layui-col-md12">
 22                 <div class="layui-card">
 23                     <div class="layui-card-body">
 24                         <table class="layui-hide" id="qua_standard_table" lay-filter="qua_standard_table"></table>
 25                     </div>
 26                 </div>
 27             </div>
 28         </div>
 29     </div>
 30 </body>
 31 <script>
 32     layui.use(['element','upload','laydate','table','form'], function(){
 33         var element = layui.element
 34             ,table = layui.table,
 35             laypage = layui.laypage,
 36             form = layui.form,
 37             upload = layui.upload,
 38             laydate = layui.laydate;
 39         //模拟数据
 40         var selectdata = [
 41             {
 42                 amountOfMoney: 5000,
 43                 basicMeasurement: "kg",
 44                 certificateNumber: "内容15",
 45                 concession: null,
 46                 contentId: null,
 47                 disqualification: null,
 48                 explains: "内容67",
 49                 files: null,
 50                 id: 2,
 51                 inspectContent: "内容22",
 52                 inspectContentNumber: "内容0000",
 53                 inspector: null,
 54                 inspectorDate: null,
 55                 inspectorDescription: null,
 56                 isNumber: null,
 57                 main: null,
 58                 manufacturer: "内容44",
 59                 materialId: 14,
 60                 materialName: "内容4",
 61                 materialNo: "内容一",
 62                 materialSize: "2*3",
 63                 meId: null,
 64                 orderAmount: 100,
 65                 orderId: 1,
 66                 orderPrice: 20,
 67                 orderedInAmount: 0,
 68                 projectName: "其他",
 69                 purchaseMeasurement: "kg",
 70                 qualified: null,
 71                 qualityStatus: null,
 72                 qualityTestedInAmount: 9,
 73                 standard: "内容11",
 74                 undetectedCount: 91,
 75             },
 76             {
 77                 amountOfMoney: 5000,
 78                 basicMeasurement: "kg",
 79                 certificateNumber: "内容14",
 80                 concession: null

最低0.47元/天解锁文章

dljm328963024

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
layui table+复杂表头+合并单元格

效果图：问题：行hover效果感觉错乱所以改为透明色代码： 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>复杂表头+select下拉框默认值+单元格合...
复制链接

扫一扫