截流自动化的商城平台
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

tostatic.html 2.9KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>转化静态表格 - 数据表格</title>
  6. <meta name="renderer" content="webkit">
  7. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  8. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  9. <link rel="stylesheet" href="../../../layuiadmin/layui/css/layui.css" media="all">
  10. <link rel="stylesheet" href="../../../layuiadmin/style/admin.css" media="all">
  11. </head>
  12. <body>
  13. <div class="layui-card layadmin-header">
  14. <div class="layui-breadcrumb" lay-filter="breadcrumb">
  15. <a lay-href="">主页</a>
  16. <a><cite>组件</cite></a>
  17. <a><cite>数据表格</cite></a>
  18. <a><cite>转化静态表格</cite></a>
  19. </div>
  20. </div>
  21. <div class="layui-fluid">
  22. <div class="layui-row layui-col-space15">
  23. <div class="layui-col-md12">
  24. <div class="layui-card">
  25. <div class="layui-card-header">转化静态表格</div>
  26. <div class="layui-card-body">
  27. <div class="layui-btn-group test-table-btn" style="margin-bottom: 10px;">
  28. <button class="layui-btn" data-type="parseTable">立即转化为数据表格</button>
  29. </div>
  30. <table lay-filter="parse-table-demo">
  31. <thead>
  32. <tr>
  33. <th lay-data="{field:'username', width:200}">昵称</th>
  34. <th lay-data="{field:'joinTime', width:150}">加入时间</th>
  35. <th lay-data="{field:'sign', minWidth: 180}">签名</th>
  36. </tr>
  37. </thead>
  38. <tbody>
  39. <tr>
  40. <td>贤心1</td>
  41. <td>2016-11-28</td>
  42. <td>人生就像是一场修行 A</td>
  43. </tr>
  44. <tr>
  45. <td>贤心2</td>
  46. <td>2016-11-29</td>
  47. <td>人生就像是一场修行 B</td>
  48. </tr>
  49. <tr>
  50. <td>贤心3</td>
  51. <td>2016-11-30</td>
  52. <td>人生就像是一场修行 C</td>
  53. </tr>
  54. </tbody>
  55. </table>
  56. </div>
  57. </div>
  58. </div>
  59. </div>
  60. </div>
  61. <script src="../../../layuiadmin/layui/layui.js"></script>
  62. <script>
  63. layui.config({
  64. base: '../../../layuiadmin/' //静态资源所在路径
  65. }).extend({
  66. index: 'lib/index' //主入口模块
  67. }).use(['index', 'table'], function(){
  68. var table = layui.table;
  69. var $ = layui.$, active = {
  70. parseTable: function(){
  71. table.init('parse-table-demo', { //转化静态表格
  72. //height: 'full-500'
  73. });
  74. }
  75. };
  76. $('.test-table-btn .layui-btn').on('click', function(){
  77. var type = $(this).data('type');
  78. active[type] ? active[type].call(this) : '';
  79. });
  80. });
  81. </script>
  82. </body>
  83. </html>