Layui表格hover显示统计气泡需通过DOM事件委托绑定mouseenter/mouseleave，利用data-index获取行数据，配合layer.tips()动态创建并手动更新位置，注意防抖、兼容性及重绘清理。
layui table hover 显示统计气泡的核心思路
直接用 lay-event + 自定义 cellmouseenter 事件不行——layui 的 table.render() 默认不暴露行级 hover 钩子，必须靠 dom 事件委托 + 手动定位气泡位置实现。关键不是“加个 tooltip”，而是让气泡内容动态匹配当前行数据、且不遮挡表格滚动或弹窗。
给 table 容器绑定 mouseenter/mouseleave 并提取行数据
Layui 表格渲染后，所有行都带 data-index 属性（如 data-index="0"），这是唯一可靠的方式获取对应行原始数据。不能依赖 tr:eq(n) 直接取 DOM 文本，因为可能有排序、分页、树形展开等干扰。
- 在
table.render()的done回调里，用$(tableElem).on('mouseenter', 'tbody tr', ...)绑定事件 - 用
$(this).data('index')拿到索引，再查table.cache["yourId"]数组取真实数据 - 避免在
mouseenter里反复调用table.cache——它每次返回新引用，应缓存到变量或闭包中 - 别用
title属性模拟气泡，Layui 的layer.tips()不支持自动跟随鼠标移动，得用layer.open()+type: 4（tips 类型）并手动更新坐标
用 layer.tips() 动态创建可跟随的统计气泡
layer.tips() 是唯一能自动销毁、带方向箭头、支持 content 函数的轻量方案。但默认不随鼠标移动，需结合 mousemove + layer.style() 调整位置，否则气泡会卡在初始坐标不动。
- 首次
mouseenter时调用layer.tips(content, trigger, {tips: [2, '#787878'], time: 0})，先建一个占位气泡 - 立即绑定
$(document).on('mousemove.tipMove', e => {...})，用e.pageX/e.pageY计算偏移，再用layer.style(index, {left: x, top: y})更新位置 - 在
mouseleave里解绑mousemove.tipMove并调用layer.close(index)，否则气泡残留 - content 推荐写成函数：
() => "<div>订单数：" + rowData.orderCount + "</div>"，确保每次取最新值
兼容性与性能注意点
表格行高不固定、开启 height 或 scroll 时，layer.tips() 容易错位。这不是 bug，是 Layui 渲染机制导致 tbody 实际 top 偏移未被 tips 感知。
- 务必在
mousemove中加防抖（setTimeout/clearTimeout），否则高频触发拖慢页面 - 如果表格启用了
skin: 'line'或'row'，气泡箭头方向要根据$(this).offset().top和窗口可视区域判断，硬写tips: [2, ...]可能朝下穿出屏幕 - 移动端慎用——hover 在 iOS/Android 上无意义，应改用 click 触发，或检测
'ontouchstart' in window切换交互方式 - 不要把统计逻辑写死在气泡里，比如实时请求接口。气泡只展示已有字段；真要异步加载，用
layer.load()占位，成功后再layer.tips(content, ...)替换
最麻烦的其实是表格重绘后气泡没清理干净，比如搜索、重载、切换页签。记得在 table.reload() 前手动 layer.closeAll('tips')。
