layui 数据表格复选框实现单选功能的例子
我就废话不多说了,大家直接看代码吧!希望能帮助到你
如下所示:
//点击选中(单选)
//单击行勾选checkbox事件
$(document).on("click",".layui-table-bodytable.layui-tabletbodytr",function(){
varindex=$(this).attr('data-index');
vartableBox=$(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");
}
//获取已选中列并取消选中
vartrs=tableDiv.find(".layui-unselect.layui-form-checkbox.layui-form-checked").parent().parent().parent();
for(vari=0;i0){
checkCell.click();
}
}
}
//选中单击行
varcheckCell=tableDiv.find("tr[data-index="+index+"]").find("tddiv.laytable-cell-checkboxdiv.layui-form-checkboxI");
if(checkCell.length>0){
checkCell.click();
}
});
$(document).on("click","tddiv.laytable-cell-checkboxdiv.layui-form-checkbox",function(e){
e.stopPropagation();
});
//点击选中(多选)
//单击行勾选checkbox事件
$(document)
.on(
"click",
".layui-table-bodytable.layui-tabletbodytr",
function(){
varobj=event?event.target:event.srcElement;
vartag=obj.tagName;
varindex=$(this).attr('data-index');
vartableBox=$(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');
}
varcheckCell=tableDiv
.find('tr[data-index='+index+']')
.find(
"tddiv.laytable-cell-checkboxdiv.layui-form-checkboxI");
if(checkCell.length>0){
checkCell.click();
}
});
$(document).on("click",
"tddiv.laytable-cell-checkboxdiv.layui-form-checkbox",
function(e){
e.stopPropagation();
})
以上这篇layui数据表格复选框实现单选功能的例子就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持毛票票。