showcheckbox: false 是唯一正确关闭方式,需在 tree.render() 配置中显式设置并重新渲染;直接删 dom 或用 css 隐藏会导致状态机错乱、回调失效、getchecked() 异常。

不能靠 CSS 隐藏或 DOM 移除,必须关掉 showCheckbox 并重新渲染树。
直接删 DOM 或 hide 复选框会出问题
手动用 $('input[type="checkbox"]').remove() 或 display: none 会让 layui 内部状态机错乱:oncheck 回调失效、父子联动中断、tree.getChecked() 返回空或错误数据。复选框不是独立 UI 元素,而是状态载体。
- layui 渲染后,复选框的勾选状态和 UI 样式(如
layui-icon-triangle-r半选图标)由内部状态驱动 - 隐藏/删除后,
tree.setChecked()仍会尝试更新已不存在的 DOM,控制台报错且无效果 - 后续调用
tree.render()若没重置配置,复选框可能意外重现
showCheckbox: false 是唯一正确关闭方式
必须在 tree.render() 配置中显式设 showCheckbox: false,并触发重新渲染。这个参数是布尔值,只认 true / false,传字符串 "false" 或数字 0 无效。
- 如果树已存在,先调用
tree.destroy('yourTreeId')清理旧实例(避免多实例冲突) - 再用新配置重新
tree.render(),确保showCheckbox: false在配置对象顶层 - 示例:
tree.destroy('deptTree');<br>tree.render({<br> elem: '#dept_tree',<br> data: treeData,<br> showCheckbox: false,<br> id: 'deptTree'<br>});
想临时“禁用”复选框?别关,改交互逻辑
如果只是不想让用户操作,但保留勾选状态和联动能力(比如回显已选权限),就别关 showCheckbox,而是禁用点击行为:
- 监听
.layui-form-checkbox的 click 事件,e.preventDefault()阻止默认行为 - 同时加样式
.layui-form-checkbox[disabled]视觉上灰掉(需额外补类名或内联 style) - 注意:不要用原生
disabled属性——layui 不识别,UI 不变,用户仍可点
真正难的不是删复选框,而是删完之后状态没人管。layui 的树组件把 DOM、数据、事件全耦合在一起,动哪一块都得动全局配置。











