layui點擊按鈕添加可編輯行

在網上看的大部分講的都不是特別的通順，而且就那麼幾篇文章都是一摸一樣的內容，跟着我走讓你做出來。

廢話不多，直接上代碼

點擊添加，新增一條空白信息。我們首先要找到列表的源碼才行，要不然即使新增了有可能會重複添加覆蓋等問題。

在看js中，承載數據的標籤

然後，在進行添加按鈕的觸發。

點擊添加按鈕執行以下代碼：

注意：tr td的標籤和div標籤，請根據你的列表源碼進行適當修改

var tr=" <tr index=1>"+
                "  <td><div class='layui-table-cell laytable-cell-1-0-0'></div></td>"+
                "  <td data-field='id' data-edit='text'><div class='layui-table-cell laytable-cell-1-0-1'></div></td>"+
                "  <td data-field='applicationName' data-edit='text'><div class='layui-table-cell laytable-cell-1-0-2'></div></td>"+
                "  <td data-field='applicationIcon' data-edit='text'><div class='layui-table-cell laytable-cell-1-0-3'></div></td>"+
                "  <td data-field='applicationLink' data-edit='text'><div class='layui-table-cell laytable-cell-1-0-4'></div></td>"+
                  "  <td data-field='applicationDescribe' data-edit='text'><div class='layui-table-cell laytable-cell-1-0-5'></div></td>"+
                "  <td data-field='uid' data-edit='text'><div class='layui-table-cell laytable-cell-1-0-6'></div></td>"+
                " <td data-field='6' align='center' data-content='' data-minwidth='50'>"+
                "<a class='layui-btn layui-btn-xs data-count-edit' lay-event='edit'>編輯保存</a><a class='layui-btn layui-btn-xs layui-btn-danger data-count-delete' lay-event='delete'>刪除</a>"+
                "</td>"+
                "  </tr>";    
                 $(".layui-table-main .layui-table tbody").append(tr); 
               var data1={id:"",applicationName:"",applicationIcon:"",applicationLink:"",applicationDescribe:"",uid:""};
               dataAdd.push(data1);  //將一條空白數據添加到dataAdd結果集中
            table.reload('currentTableId',{
                data : dataAdd  //將數據重新渲染到列表中
            });

 

這樣就完成了添加一行的操作，也不會出現屬性未識別。