1、table单击tr行勾选checkbox功能:
//单击行勾选checkbox事件
var tableDiv;
$(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 trs = tableDiv.find(".layui-unselect.layui-form-checkbox.layui-form-checked").parent().parent().parent();
for(var i = 0;i<trs.length;i++){
var ind = $(trs[i]).attr("data-index");
if(ind!=index){
var checkCell = tableDiv.find("tr[data-index=" + ind + "]").find("td div.laytable-cell-checkbox div.layui-form-checkbox I");
if (checkCell.length>0) {
checkCell.click();
}
}
}
//选中单击行
var checkCell = tableDiv.find("tr[data-index=" + index + "]").find("td div.laytable-cell-checkbox div.layui-form-checkbox I");
if (checkCell.length>0 & trs.length===1) {
checkCell.click();
}
checkCell.click();
});
$(document).on("click", "td div.laytable-cell-checkbox div.layui-form-checkbox", function (e) {
e.stopPropagation();
});
2、单击table表格tr行勾选radio功能:
//点击整行表格中的tr将选中单元格的单选框按钮
$('.DetailDiv').on("click",".layui-table-body table.layui-table tbody tr", function () {
/*当单击表格行时,把单选按钮设为选中状态*/
var tableDiv;
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.layui-table-cell div.layui-form-radio I");
if (checkCell.length>0) {
checkCell.click();
}
});
//对td的单击事件进行拦截停止,防止事件冒泡再次触发上述的单击事件 将此代码在页面初始化后执行一次即可
$('.DetailDiv').on("click", "td div.layui-table-cell div.layui-form-radio", function (e) {
e.stopPropagation();
});
然后可直接将选中行的值填充到表单中去:
table.on('radio(orderbodyTab)', function(obj){
var datas=obj.data;
$('input[name="orderNo"]').val(datas.orderNo);
......
});
以上两种方法都可作为通用js方法,dom查找比较原生,希望各位有更好的方法多交流。