必须手动接管搜索逻辑:先过滤 table.cache 中 LAY_DISABLED 为 false 的数据再匹配关键词,用 table.reload 传参并配合 done 回调调用 renderData 刷新 tbody;穿梭框需禁用 showSearch 自行 DOM 控制显隐;表单验证需通过 item.name 区分字段并同步返回结果;前后端禁用字段命名必须严格一致。

layui table 搜索时怎么跳过禁用行
原生 table.search() 不会识别 LAY_DISABLED: true,所有行(包括灰色不可操作的)都会参与匹配,导致搜出一堆点不了的项。必须手动接管搜索逻辑,过滤掉禁用行再渲染。
- 先调用
table.cache['your-id']拿到当前页全部数据,用.filter(item => !item.LAY_DISABLED)筛出可用行 - 对这些可用行做关键词匹配(比如
item.title.includes(keyword)),别直接遍历整个 cache - 匹配结果不能直接塞给
table.render({ data: [...] })—— 这会丢掉分页、排序等状态;应改用table.reload('your-id', { where: { keyword } }),后端按条件查并返回带LAY_DISABLED标记的数据 - 前端收到响应后,在
done回调里再次过滤禁用行,再调table.renderData()仅刷新 tbody,避免重绘表头
transfer 穿梭框搜索如何排除 disabled 项
showSearch: true 的搜索是全局匹配原始 data 数组,disabled: true 的项只要 title 含关键词就会显示出来,只是 checkbox 灰掉——用户看到“搜到了却点不了”,体验断裂。真正要排除,得在本地过滤逻辑里显式判断字段值。
- 禁用
showSearch,自己在左右面板上方各加一个<input class="search-left">和<input class="search-right"> - 监听
input事件,获取当前输入值val - 遍历原始
data,只保留满足item.title.includes(val) && item.disabled !== true的项 - 用
document.querySelectorAll('.layui-transfer-item')找到所有条目 DOM,根据是否在过滤结果中设style.display = 'block'或'none' - 别用
transfer.reload(),它会清空当前选中态;DOM 显示控制更轻量也更安全
form 表单验证里怎么让关键词不匹配某些字段
自定义 lay-verify 规则时,常需「搜用户名但排除邮箱字段」或「校验手机号但跳过备用号码」。Layui 不提供字段白名单机制,得靠 JS 层面手动识别上下文。
- 验证函数第二个参数
item是当前 DOM 元素,可用item.name或item.getAttribute('data-field')区分字段用途 - 例如:只对
name="username"做查重,遇到name="email"直接return ''跳过 - 若需动态排除(如编辑时跳过自身 ID),从
item.closest('form')里找隐藏的<input name="id">,把 ID 传给后端校验接口 - 千万别在验证函数里写异步逻辑(如
setTimeout),form.verify只认同步返回值
搜索功能上线前最易忽略的一点
所有手动过滤都依赖原始数据里的标记字段是否真实可靠——比如 LAY_DISABLED 是后端返回的,还是前端临时加的 class?如果后端没传这个字段,或字段名写成 is_disabled,前端过滤就全失效。上线前务必确认前后端字段命名和语义完全一致,且禁用状态由服务端权威决定,不能靠前端 JS 临时 patch。


















