必须在done回调中用事件委托绑定点击事件，传入layer.photos({photos:{data:[{src:xxx}]}})结构；templet内联onclick会因转义失效，且需过滤空值、校验URL可访问性。
直接用 layer.photos 配合事件委托就能实现，但必须传对结构、选对绑定时机，否则点不动或报 Cannot read property 'length' of undefined。
templet 里别写 onclick，用 lay-event 或 class 标记可点区域
layui 表格动态渲染，onclick 写在 templet 字符串里会被转义失效，翻页后彻底失联。正确做法是加语义化标记：
- 推荐用
lay-event="preview"：在列配置中写templet: '<div lay-event="preview"><img src="{{d.avatar}}" style="max-width:60px;"></div>' - 或者统一加 class：
templet: '<img src="{{d.avatar}}" class="table-img-preview" style="max-width:60px;">'，后续委托到这个 class - 务必加
max-width控制缩略图尺寸，避免单元格撑开或拉伸变形 - 空值要过滤：
{{# if(d.avatar && d.avatar !== "about:blank"){ }}<img src="{{d.avatar}}">{{# } }}
事件必须在 done 回调里委托，目标容器选 .layui-table-box
表格重载、翻页时 <tbody> 会重建，直接绑 $('img') 或 $('#tableId') 全部失效。必须委托到长期存在的父容器：
- ✅ 正确：
layui.$('#yourTableId').next('.layui-table-box').on('click', '.table-img-preview', function(){...}) - ✅ 也可用
layui.$('.layui-table-body')，它只含内容区，更干净 - ❌ 错误：
$('#yourTableId').on('click', 'img')—— 这个 ID 容器里根本没 img 节点 - 每次
done触发时建议先.off().on()，防止重复绑定
layer.photos 的参数结构不能错，src 必须是数组里的对象字段
layer.photos 不接受字符串、数组或扁平对象，只认嵌套两层的固定格式，错一个括号就报错：
- ✅ 正确：
layer.photos({ photos: { data: [{ src: src }] } }) - ❌ 错误：
layer.photos({ src: src })、layer.photos([src])、layer.photos({ photos: src }) -
src必须是浏览器可直链的 URL（含http://、https://或相对路径），undefined、""、about:blank会导致预览空白 - 从 DOM 取地址推荐用
$(this).attr('src')，如果存了原图地址在data-big就用$(this).data('big')
最易被忽略的是图片地址是否真正可访问——控制台 Network 里看请求状态码，404 或跨域失败时 layer.photos 不报错，只会静默黑屏。另外，layui.use(['table', 'layer'], function(){}) 必须把 layer 显式传进回调，否则 layer.photos 是 undefined。
