layui表格数据复选框回显设置方法
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了layui表格数据复选框回显设置方法，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含1257字，纯文字阅读大概需要2分钟。
内容图文
layui2.3版本，本身并不带有复选框回显功能，那么需要从源头解决此事，F12代码调试，找到与复选框关联的地方发现：
我们只需要在渲染数据回调时找到每个复选框根据数据的不同来设置回显。
layui这里有一个坑，设置class属性后会造成二次点击效果，千万不要手动修改class属性，那么应该怎么办呢？
每次**点击**其中一个复选框时都会增加一个class属性，第二次点击又会给删除：
table.render({
elem: '#LAY_table_topic',
url: '/admin/topicHandle/getTopicList',
height: 600,
done:function(result,currPage,count){//数据回调方法
var data = result.data;
data.forEach(function(value, key) {
//这里必须选择点击方法，不知为何添加layui-form-checked class属性会造成二次点击（即下次点击必须点击两下才能生效）bug，
//所有类似的手动修改class貌似都会造成二次效果
if(value.read_total > 10){
$("div[lay-id='topicList'] td .layui-form-checkbox").eq(key).click();
}
})
},
cols: [[
{ type:'checkbox'},
{ field:'id', title: '话题ID', width: 80 },
{ field:'image_url', title: '图片', width: 100 , templet:"#showPic"},
{ field:'content', title: '话题内容', width: 260 },
{ field:'read_total', title: '阅读次数', width: 100 , sort:true},
]],
id: 'topicList',
page: true
});
以上这篇layui表格数据复选框回显设置方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
内容总结
以上是互联网集市为您收集整理的layui表格数据复选框回显设置方法全部内容，希望文章能够帮你解决layui表格数据复选框回显设置方法所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。