Layui Table 点击行时选中单选框或复选框

原创
2023/05/17 17:19
阅读数 124

Layui Table 点击行时选中单选框

//注:test是table原始容器的属性 lay-filter="对应的值"
layui.table.on('row(i_Layer_SearchResult_Table_Filter)', function (obj) {
    //选中行样式
    obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
    //选中radio样式
    obj.tr.find('i[class="layui-anim layui-icon"]').trigger("click");
});

 

 

Layui Table 点击行时选中复选框

$(document).on("click", ".layui-table-body table.layui-table tbody tr", function () {
    var index = $(this).attr('data-index');
    var tableBox = $(this).parents('.layui-table-box');
    //存在固定列
    if (tableBox.find(".layui-table-fixed.layui-table-fixed-l").length > 0) {
        tableDiv = tableBox.find(".layui-table-fixed.layui-table-fixed-l");
    } else {
        tableDiv = tableBox.find(".layui-table-body.layui-table-main");
    }
    var checkCell = tableDiv.find("tr[data-index=" + index + "]").find("td div.laytable-cell-checkbox div.layui-form-checkbox I");
    if (checkCell.length > 0) {
        checkCell.click();
    }
});
//对td的单击事件进行拦截停止,防止事件冒泡再次触发上述的单击事件(Table的单击行事件不会拦截,依然有效)
$(document).on("click", "td div.laytable-cell-checkbox div.layui-form-checkbox", function (e) {
    e.stopPropagation();
});
展开阅读全文
加载中
点击引领话题📣 发布并加入讨论🔥
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部