必须用事件代理绑定表格容器的td点击事件，即$(tableElem).on('click', 'td', ...)，并在render()的done回调中执行；高亮需用自定义class加!important，通过data-field区分列，编辑框聚焦样式需额外覆盖。
单元格点击高亮必须用事件代理绑定 td，不能直接绑 onclick
直接给 td 元素写 onclick 或用 layui.$('td').on('click', ...) 绑定，会在分页、排序、重载后失效——因为 layui 会重建 td dom，原有监听器就丢了。正确做法是监听表格容器的委托事件：$(tableelem).on('click', 'td', function(){})，其中 tableelem 是 table.render() 返回的 elem 属性值。
常见错误现象：点第一页有效，翻页后点击无反应；或点了没报错也没效果——大概率是事件注册时机不对，比如在 render() 前就执行了绑定，或者没用 tableElem 而用了全局选择器（如 $('td')）导致跨表干扰。
- 必须在
table.render()的done回调里注册事件，此时 DOM 已渲染完成 - 别用
$('.layui-table td')，应从tableElem出发：$(tableElem).on('click', 'td', ...) - 移动端需加 CSS：
cursor: pointer和-webkit-tap-highlight-color: transparent，否则点击没视觉反馈
高亮样式必须用 class + !important，不能靠内联 style
用 $(this).css('border', '2px solid #2080f0') 或 $(this).attr('style', ...) 设置边框，大概率被 Layui 内部样式覆盖（比如 .layui-table tbody tr:hover td 的透明底色或重置规则）。唯一可靠方式是定义自定义 class，并在 CSS 中用 !important 提权：
.layui-table-cell-border-highlight {
border: 2px solid #2080f0 !important;
box-sizing: border-box !important;
}
每次点击前先清除所有已高亮的单元格：
$(tableElem).find('td.layui-table-cell-border-highlight').removeClass('layui-table-cell-border-highlight')- 再给当前
td加上：$(this).addClass('layui-table-cell-border-highlight') - 不要操作
style属性——Layui 重绘时会清空它
如何识别并区分不同列的单元格高亮
Layui 渲染时会给每个 td 加 data-field 属性（值为列配置里的 field），这是区分列最稳定的方式。比如某列配置为 {field: 'price', title: '价格'}，对应 td 就有 data-field="price"。
如果只想让“价格”列支持边框高亮，可以在事件回调里加判断：
if ($(this).data('field') !== 'price') return;- 或者反过来：只对特定列移除/添加高亮 class
- 避免全表
td都响应，减少误触和性能开销
注意：data-field 是字符串，不是数字索引，不受分页、排序影响，比 index 更可靠。
编辑态输入框的边框和单元格高亮是两回事
点击单元格触发编辑（如 edit: 'text'）后弹出的 input，它的边框由 .layui-input 控制，和你给 td 加的高亮 class 无关。如果想让编辑框也同步变色，得额外覆盖 CSS：
.layui-table .layui-input:focus {
border-color: #2080f0 !important;
outline: none;
}
这个规则必须带 .layui-table 前缀，否则会影响页面其他地方的 .layui-input；且要加 !important，因为 Layui 默认用了内联或高优先级选择器。
真正容易被忽略的是：单元格高亮和编辑框聚焦是两个独立状态。用户可能先点单元格高亮，再点编辑框——这时你要决定是否自动移除高亮（通常建议移除，避免视觉冲突），这得靠事件冒泡控制或 focusin/focusout 监听配合处理。
