layui 2.8+ 中 edit 回调的 obj.tr 直接提供当前编辑单元格所在行的原生 dom 元素，可转 jquery 操作；旧版需手动查找。
layui table edit 编辑后怎么拿到当前行的 DOM
编辑单元格触发 edit 事件时，Layui 默认只传入 obj 对象（含 value、field、row 等），但不直接提供行 DOM。要操作该行元素（比如高亮、禁用其他列、触发表单校验），必须从 obj 反向定位到对应 <tr>。
<h3>用 obj.tr 获取行 DOM 是最直接的方式</h3>
<p>Layui 2.8+ 版本中，<code>edit 回调的 obj 已内置 tr 属性，它就是当前被编辑单元格所在行的原生 <tr> 元素（不是 jQuery 对象）。这是官方支持且最稳定的方法：
<pre class="brush:php;toolbar:false;">table.on('edit(test)', function(obj){
var $tr = $(obj.tr); // 转为 jQuery 方便操作（可选）
console.log(obj.tr); // 原生 DOM，如 <tr data-index="0">...
// 后续可做：$tr.addClass('editing'), $tr.find('.other-col').prop('disabled', true)
});
<ul>
<li>无需手动遍历或查 data-index，<code>obj.tr</code> 在所有支持 edit 的列类型（input、select）下都有效</li>
<li>注意：这个 <code>tr</code> 是表格 body 中的 <code><tr>，不是表头或固定列的包裹容器
<li>若使用了 <code>fixed: true</code> 列，其 edit 事件仍会正确返回所在逻辑行的 <code>tr</code>（非 fixed 区域的 DOM）</li>
<h3>兼容旧版（
</h3>
<p>极少数定制版或早期版本可能缺失 <code>obj.tr</code>。此时需借助 <code>obj.row</code> 和表格数据索引反查 DOM：</p>
<ul>
<li>
<code>obj.row</code> 是当前行完整数据对象，通常含唯一标识字段（如 <code>id</code> 或 <code>uid</code>）</li>
<li>用 <code>table.cache['test']</code> 获取当前表格缓存数据，遍历找到匹配项的索引 <code>i</code>
</li>
<li>再通过 <code>layui.$('#test tbody tr').eq(i)</code> 拿到对应 <code><tr>
<li>更稳妥的做法是给表格配置 <code>id</code> 字段（如 <code>{ field: 'id', title: 'ID', width: 100 }</code>），确保每行有稳定 key</li>
<p>不推荐用 <code>$(obj.elem).closest('tr')</code> —— 因为 <code>obj.elem</code> 是 input 元素，而 Layui 的单元格结构在某些主题或自定义模板下可能嵌套较深，容易取错父级。</p><div class="aritcle_card flexRow artxards">
<div class="artcardd flexRow">
<a class="aritcle_card_img" rel="nofollow" href="/xiazai/code/7535" title="深蓝色网站后台管理系统layui框架模板-AdminPro"><img
src="https://img.php.cn/upload/webcode/000/287/557/6340dac18f876183.png" alt="深蓝色网站后台管理系统layui框架模板-AdminPro" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a rel="nofollow" href="/xiazai/code/7535" title="深蓝色网站后台管理系统layui框架模板-AdminPro" class="overflowclass">深蓝色网站后台管理系统layui框架模板-AdminPro</a>
<p class="overflowclass">一款深蓝色网站后台管理系统layui框架模板</p>
</div>
<a rel="nofollow" href="/xiazai/code/7535" title="深蓝色网站后台管理系统layui框架模板-AdminPro" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
</a>
</div>
</div>
<h3>为什么不能依赖 data-index 属性直接 querySelector</h3>
<p>虽然 <code><tr data-index="2"> 看似可用，但要注意：
<ul>
<li>
<code>data-index</code> 是 Layui 内部序号，分页后会重置，非全局唯一</li>
<li>开启 <code>page: false</code> 且数据动态增删时，<code>data-index</code> 可能滞后于实际 DOM 顺序</li>
<li>使用 <code>table.reload()</code> 后，旧 <code>tr</code> 被销毁，新 DOM 的 <code>data-index</code> 重新生成，缓存的 index 值立即失效</li>
<li>所以硬编码 <code>document.querySelector('tr[data-index="2"]')</code> 在复杂交互中极易出错</li>
</ul>
<p>真正可靠的始终是事件回调里带出来的上下文引用，比如 <code>obj.tr</code> 或基于业务主键的查找逻辑。</p>
</tr></code></p>
</tr></code>
</li>
</ul>
</tr></code>
</li>
</ul>
</tr></pre>
</tr>
