Layui表格列默认只读,不写edit属性即不可编辑;templet列需手动实现编辑逻辑;导出CSV无只读概念,应过滤敏感字段。
列配置不写 edit 就是默认不可编辑
只要列定义里没加 edit: 'text'(或 'number'、'date' 等),这列天生就点不动、双击不弹输入框——layui 表格所有单元格默认只读,不需要额外“禁用”。
常见错误是误以为写了 table.on('cell()') 或绑了 click 事件就能触发编辑,其实那只是监听点击,和编辑能力完全无关。
- 检查列配置是否漏写了
edit属性(比如拼成editor或大小写错误) - 确认没在
templet里手动渲染<input>,否则edit配置会被忽略 - 别在
done回调里用 jQuery 去设contentEditable="false",这是干扰 layui 内部状态的多余操作
table.on('edit()') 里 return false 不是禁用,是中断已开始的编辑
这个事件是编辑**已经触发之后**才执行的回调。你在这里 return false,只会阻止后续保存逻辑,但输入框早已渲染出来,用户照样能输、能删、能失焦提交——数据甚至进了 table.cache,只是你没处理而已。
真正想让某列不可编辑,必须从源头控制:
- 静态场景:列配置直接不写
edit - 动态场景(比如某列多数可编、少数不可编):在
done回调里用$('tr[data-index="0"] td[data-field="status"]').data('edit', false) - 条件判断示例:
if (item.status === 'done') { $('...td[data-field="score"]').data('edit', false) }
用了 templet 的列,edit 配置根本不起作用
只要列配置写了 templet,无论你加不加 edit: 'text',layui 都不会往模板里塞 <input> ——它只负责渲染你写的 HTML,编辑逻辑全得自己接管。
如果你需要部分行可编辑、部分不可编辑,就得在 templet 里手动判断并决定是否渲染 <input>,再绑定更新逻辑,比如:
templet: function(d) {
if (d.status === 'done') {
return d.score; // 纯文本
}
return '<input type="number" value="' + d.score + '">';
}
注意:这样写后,你还得自己监听 input 变化、调用 table.cache 更新、触发重绘,layui 不会自动帮你做这些。
导出时想让某列“只读”?别白费劲
table.exportFile() 导出的是 CSV 文本,不是真正的 Excel 文件。CSV 没有“只读列”概念,所有字段打开后天然可编辑。
你在列配置里加 readonly: true、edit: false 或 export: false 全部无效——这些只影响前端双击行为,对导出零作用。
真实需求通常是“不让别人改 ID、创建时间这类敏感字段”,更务实的做法是导出前过滤掉它们:
- 用
table.getData('your-table-id')拿全量数据(Layui 2.7+) data.map(({ id, username, status }) => ({ username, status }))-
layui.table.exportFile('导出标题', filteredData, 'csv'),第三个参数'csv'必须显式传
最常被忽略的一点:很多人花半天研究 Excel 保护,却没意识到 CSV 根本不支持这个特性——前端 JS 里硬塞个密码,等于把钥匙贴在门上。


















