layui框架中在table使用复选框checkbox的时候,发现复选框不显示,查看源码发现根本就没有复选框的代码,在网上找了半天,答案基本都是说:用form.render()刷新、没有正确载入JS等,没有一个能解决的,后来无意中才发现,原来需要增加 checkbox:true 才行,下面直接上代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>table模块快速使用</title>
<link rel="stylesheet" href="./plugins/layui/css/layui.css" media="all">
</head>
<body>
<table class="layui-hide" id="test"></table>
<script src="./plugins/layui/layui.js" charset="utf-8"></script>
<script>
layui.use('table', function(){
var table = layui.table;
table.render({
elem: '#test'
,url:'table.json'
,width: 900
,height: 600
,cols: [[
{checkbox:true,type:'checkbox', fixed: 'left'}//这一行用于显示复选框
,{field:'id', width:80, title: 'ID', sort: true, fixed: 'left'}
,{field:'username', width:80, title: '用户名', fixed: 'left'}
,{field:'sex', width:80, title: '性别', sort: true}
,{field:'city', width:80, title: '城市'}
,{field:'sign', width: 219, title: '签名'}
,{field:'experience', width:80, title: '积分', sort: true}
,{field:'score', width:80, title: '评分', sort: true}
,{field:'classify', width:80, title: '职业'}
,{field:'wealth', width:120, title: '财富', sort: true}
]]
,page: true
});
});
</script>
</body>
</html>