event.target.innerHTML = cellInput.selectedOptions[0].text;
//将所选中元素的值赋给该行的值,每个属性都执行一次赋值，那么在最终提交表单的时候，就能保证当前表的值传到后端
row.fildtp=cellInput.value;
}
}else if(name==="musttg"){
cellInput = document.createElement("select");
option.value="1";
option.text="是";
option2.value="0";
option2.text="否";
cellInput.appendChild(option);
cellInput.appendChild(option2);
cell.appendChild(cellInput);
cellInput.onblur = function() {
cell.removeChild(cellInput);
event.target.innerHTML = cellInput.selectedOptions[0].text;
row.musttg=cellInput.value;
}
}else if(name==="looptg"){
cellInput = document.createElement("select");
option.value="1";
option.text="循环";
option2.value="0";
option2.text="非循环";
cellInput.appendChild(option);
cellInput.appendChild(option2);
cell.appendChild(cellInput);
cellInput.onblur = function() {
cell.removeChild(cellInput);
event.target.innerHTML = cellInput.selectedOptions[0].text;
row.looptg=cellInput.value;
};
}else{
debugger
cellInput = document.createElement("input");
cellInput.value = "";
cellInput.setAttribute("type", "text");
cellInput.style.width = "75%";
cell.appendChild(cellInput);
cellInput.onblur = function() {
cell.removeChild(cellInput);
event.target.innerHTML = cellInput.value;
if(name==="fildcd"){
row.fildcd=cellInput.value;
}else if(name==="fildna"){
row.fildna=cellInput.value;
}else if(name==="fildln"){
row.fildln=cellInput.value;
}else if(name==="fildde"){
row.fildde=cellInput.value;
}else if(name==="defult"){
row.defult=cellInput.value;
}else if(name==="format"){
row.format=cellInput.value;
}else if(name==="enumcd"){
row.enumcd=cellInput.value;
}else if(name==="loophd"){
row.loophd=cellInput.value;
}else if(name==="remark"){
row.remark=cellInput.value;
}
};
}
},
这种方式，比较详细，也比较容易理解，但是总感觉有点不完美，首先新增了一行以后，必须要双击某一个单元格参能进行内容的输入，不够明显。从代码上来说，代码量也较大；而且使用的是原生的html标签，因此，我在之后对此进行了一个优化，直接使用vue的代码实现，不仅大大减少了代码量，还实现了操作的友好性。具体实现可以查看的我的文章：Vue+Element实现表格的编辑、删除、以及新增行的最优方法
