(编辑:jimmy 日期: 2024/11/20 浏览:2)
"htmlcode">
$("#addTable").click(function(){ var tr=" <tr>"+ " <td>11</td>"+ " <td>22</td>"+ " <td>33</td>"+ " <td>44</td>"+ " <td>55</td>"+ " </tr>"; $(".layui-table").append(tr); });
并不能实现添加的效果;后查询后发现,这样做是基于table是用静态的方式编写的,即:
<table class="layui-table" lay-data="{height:315, url:'/demo/table/user/', page:true, id:'tableInfo'}" lay-filter="test"> <thead> <tr> <th lay-data="{field:'id', width:80, sort: true}">ID</th> <th lay-data="{field:'username', width:80}">用户名</th> <th lay-data="{field:'sex', width:80, sort: true}">性别</th> <th lay-data="{field:'city'}">城市</th> <th lay-data="{field:'sign'}">签名</th> <th lay-data="{field:'experience', sort: true}">积分</th> <th lay-data="{field:'score', sort: true}">评分</th> <th lay-data="{field:'classify'}">职业</th> <th lay-data="{field:'wealth', sort: true}">财富</th> </tr> </thead> </table>
而我用的是这样的方式:<table class="layui-hide" id="baseInfo" lay-filter="demo" lay-data="{height: 'full-200', cellMinWidth: 80, page: true, limit:30}"></table>
关于列名的定义是写在table.render({})
方法中的
".layui-table-body .layui-table").append(tr);
最后即可实现点击按钮新增一条数据的效果。
总结
以上所述是小编给大家介绍的layui点击按钮给table添加一行,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!