Layui表头无法直接渲染input且回车无响应，因列标题默认转义HTML、不绑定键盘事件；搜索必须用table.reload()并传where和page:{curr:1}，事件需在done回调中用layui.$精准绑定keydown监听Enter键。
为什么直接写 <input> 在表头没反应
因为 layui 表格的列标题（title）默认不支持直接渲染 html，即使你用 templet 返回 <input name="username">，layui 2.8 以下版本会转义掉标签；2.8+ 虽支持，但输入框无法自动聚焦、事件易丢失、列宽计算错乱。更关键的是：layui 根本不为这些自定义 dom 绑定任何键盘事件逻辑——回车自然没响应。
table.reload() 是搜索的核心，不是装饰性调用
所有搜索行为最终都得靠 table.reload() 触发重载，并传入正确的 where 参数。常见错误是只改了 input 值却没 reload，或 reload 时漏了 page: { curr: 1 }，导致搜出结果却卡在非第一页空白处。
- 必须指定表格的
id（table.render({ id: 'userTable' })），否则table.reload('userTable', ...)找不到目标 -
where对象的 key 必须和后端接口字段名完全一致（比如后端要userName，你就不能传username） - 值要用
this.value.trim()获取，避免空格干扰查询 - 务必加
page: { curr: 1 }，否则用户在第 10 页搜，结果仍试图显示第 10 页数据
在 done 回调里绑定 keydown 才可靠
done 是表格 DOM 渲染完成后的唯一稳定时机。早于它绑定，layui.$('input[name="username"]') 可能查不到元素；晚于它（比如全局监听），可能因多次 reload 导致重复绑定，按一次回车触发多次请求。
- 用
layui.$('input[name="username"]')精准定位，别用.layui-input这类泛选择器 - 判断回车用
e.key === 'Enter'，比e.keyCode === 13更现代、兼容性更好 - 必须加
e.preventDefault()，否则表单会 submit 或页面刷新 - 示例片段：
done: function(res, curr, count) {
layui.$('input[name="username"]').on('keydown', function(e) {
if (e.key === 'Enter') {
e.preventDefault();
table.reload('userTable', {
where: { username: this.value.trim() },
page: { curr: 1 }
});
}
});
}
外置搜索框比表头内嵌更稳，CSS 定位就能“看起来一样”
强行把 <input> 塞进某一列表头，容易错位、遮挡排序图标、响应式失效。实际项目中，90% 的稳定方案是：把搜索框放在表格容器上方，用 CSS 绝对定位“视觉对齐”目标列。
- HTML 结构示例：
<div class="table-container"><div class="search-overlay"><input type="text" id="usernameSearch"></div><table id="userTable"></table></div> - 这样既能复用同一套事件绑定逻辑，又避免了
templet渲染时机、DOM 重绘冲突等问题 - 如果一定要多列联合搜索，就用多个独立
<input>+ 一个统一搜索按钮，动态拼where对象
真正容易被忽略的点是：每次 reload 后，如果你用了下拉框、日期控件等依赖 form.render() 的组件，它们的状态不会自动同步——得在 done 里手动调一次 form.render()，否则选中的值可能还是旧的。
