必须在templet中使用可点击容器（如div）包裹内容，而非直接写lay-tips；事件绑定须在done回调中用委托方式；layer.tips需传全参数并转义内容防XSS。
templet里必须放可点击容器，不能只写lay-tips
layui table 渲染时会剥离所有原生属性，包括 lay-tips、title 甚至内联 onclick。直接在列配置里写 lay-tips="xxx" 或在 templet 里返回带 title 的标签，都不会生效。
正确做法是在 templet 中返回一个有明确 class 或 data 属性的包裹元素，比如：
<div class="cell-tip-trigger" data-content="{{d.detail}}">{{d.name}}</div>
这个 div 是后续事件绑定和提示触发的真实锚点，它必须存在且唯一——不能用 td 自身，因为 layui 可能重用或替换其内部结构。
必须在 done 回调里用事件委托绑定，别写在 render 外
表格 DOM 是异步渲染出来的，templet 返回的元素在 render() 执行时根本不存在。如果提前用 $('.cell-tip-trigger').on('click', ...)，会绑定失败或绑定到旧 DOM 上。
可靠写法是把事件逻辑全塞进 done 回调里，并用事件委托避免重复绑定：
- 用
$(document).on('click', '.cell-tip-trigger', ...)—— 全局委托，不怕重绘 - 或在
done里查当前页节点：document.querySelectorAll('.cell-tip-trigger')，再遍历绑定（更轻量） - 每次 click 前先关掉已存在的 tips：
layer.closeAll('tips')，否则多个气泡堆叠
layer.tips() 必须传全参数，方向+颜色缺一不可
不传 tips 参数，就用默认红色背景；只传方向不传颜色，还是默认色；颜色值漏掉 #（比如写 '4caf50'），整个参数失效，退回默认。
典型调用示例：
layer.tips($(this).data('content'), this, {<br> tips: [2, '#2196F3'], // 2=右方向，#2196F3=蓝色背景<br> time: 0, // 不自动关闭<br> maxWidth: 200<br>});
注意几点：
-
this指向的是触发点击的那个.cell-tip-trigger元素，不是td或tr -
time: 0是必须的，否则气泡闪一下就消失 - 移动端要同时监听
touchstart，单靠click在 iOS 上可能延迟或失效
内容含 HTML 或变量时务必转义，否则 XSS 风险真实存在
直接拼接 d.detail 到 layer.tips() 第一个参数里，如果后端返回的是 <img src="x" onerror="alert(1)" alt="Layui table如何设置单元格点击后出现一个气泡提示" >，就会执行脚本。
安全做法是：
- 用
layui.util.escape(d.detail)过滤所有 HTML 标签 - 若必须支持简单格式（如换行），先 escape 再把
\n替换成<br>，但不要允许任意标签 - 值为
null或undefined时兜底：layui.util.escape(d.detail || '')
最易被忽略的是：气泡一旦弹出，就脱离表格 DOM 生命周期，滚动、分页、排序都不会自动销毁它——必须手动 layer.closeAll('tips') 或记录 index 精确关闭。这点在复杂交互场景下尤其关键。
