layui表格默认点击第一行

罗雀儿

已于 2023-01-03 17:30:07 修改

阅读量3.4k

点赞数

分类专栏：前端文章标签： layui

于 2020-09-03 17:36:41 首次发布

本文链接：https://blog.youkuaiyun.com/qq_22165667/article/details/108389045

版权

前端专栏收录该内容

7 篇文章

订阅专栏

本文介绍了一种在前端开发中实现表格联动的方法，通过在汇总表格中点击一行时，详情列表会显示相应的信息。同时，在表格加载完成后，默认选中第一行，增强了用户体验。代码示例使用了layui框架。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

为了实现联动效果，汇总列表点击一行，详情列表则显示清单列表。每次打开页面，默认选中第一行。

onClickRow：单击事件

table的lay-filter="governmentCustomerTable"

注意：在汇总表格加载完成后的done函数里实现,

onClickRow: function (obj) {
   // 单击行触发
    alert(1);
},
done: function (res, curr, count) {
            //表格加载完成后，默认选中第一行
            $('.layui-table-view[lay-id="governmentCustomerTable"]').children('.layui-table-box').children('.layui-table-body').find('table tbody tr[data-index="0"]').click();
}

效果如下：