layui表格按钮控制选中行开启单元格可编辑

我们有时候需要对表格选中行开启单元格编辑，进行一些编辑操作，以下代码可为你提供思路:

for (var j = 0; j < idsAll.length; j++) {//开启单元格编辑状态
    let index = idsAll[j]['LAY_TABLE_INDEX'];
    if($('#resourceDiv .layui-table-fixed-l tr[data-index=' + index + '] input[type="checkbox"]')[0].checked){//判断单元格是否选中
      $('#resourceDiv .layui-table tr[data-index=' + index + ']' ).find('td').not(".layui-table-col-special").data('edit', true);//核心代码
    };
  }
  layui.use(['table'], function(){
    var table = layui.table
    //监听单元格编辑
    table.on('edit(resource)', function(obj){
      var value = obj.value; //得到修改后的值
      let data = obj.data; //得到所在行所有键值
      let field = obj.field; //得到字段
      var recodePage = $("#resourceDiv .layui-laypage-skip .layui-input").val();//获取当前页
      var recodeLimit = $("#resourceDiv .layui-laypage-limits").find("option:selected").val();//获取当前页条数
    });       
  });

idsAll里面是表格数据，layui表格请求我在parseData方法里将返回的数据赋值给了idsAll,你们也可以换个方式进行操作。

如果你的表格里有复选框，增加了左侧固定列序号或者其他操作，那你在开启行单元格编辑的时候需要使用我的这种方法：

 $('#resourceQueryResultDiv .layui-table tr[data-index=' + index + ']' ).find('td').not(".layui-table-col-special").data('edit', true);//核心代码

如果没有只是单纯的开启单元格编辑填写信息的话，只需要：

 $('#resourceQueryResultDiv .layui-table tr[data-index=' + index + ']' ).find('td').data('edit', true);//核心代码

关闭单元格的操作只需要把true变成false。我再获取元素的时候都加了id，是为了锁定表，不让多个表相互影响，如果只有一个表格可以不进行这个操作。

在单元格监听事件中可以对自己修改的数据进行一些自己需要的操作，若有问题可以留言探讨。哈哈