项目需求：动态的增加表格行数据，并且单元格允许支持下拉框。
解决步骤：
1、编写表格头部内容
2、编写动态生成数据行的JS代码，使用拼接HTML方式，具体逻辑可参考代码。（此方法比较繁琐，亦可用其他方式）
$(document).ready(function(){
layui.use(['jquery','table','form'], function(){
var table = layui.table,
$ = layui.jquery,
form = layui.form;
//添加行按钮
$(".add_tr_btn").click(function(){
var tableRow = HTable.ADD_TR(HTable.trNum);
var trObj = $("#resTable").children('tbody').find('tr');
var tbody = $("#resTable").find('tbody');
tbody.append(tableRow);
form.render();
});
//保存按钮
$(".add_res_btn").click(function(){
//var json = $(".res_field_form").serializeJSON();
var result = $(".res_field_form").parseFormJSON();
alert(JSON.stringify(result));
});
});
});
//定义HTable对象
window.HTable = {
trNum:1,
count:0,
DEL_TR:function(trNum){
$("#tr"+trNum).remove();
this.trNum--;
if(this.trNum==0){
this.trNum=1;
}
this.count--;
if(this.count<0){
this.count=0;
}
$("#count").text(this.count);
},
ADD_TR:function(trNum){
var IsNullHtml = "";
var IsShareHtml = "";
var ShareTypeHtml = "";
var IsPublicHtml = "";
var PublicTypeHtml = "";
var result = ""+
""+IsNullHtml+" "+
""+IsShareHtml+" "+
""+ShareTypeHtml+" "+
""+IsPublicHtml+" "+
""+PublicTypeHtml+" "+
"删除 "+
" ";
this.trNum++;
this.count++;
$("#count").text(this.count);
return result;
},
TR_ROW:function(trNum,trHtml){
}
}说明：
1）HTable.DEL_TR是直接绑定到标签中，亦可考虑动态绑定的方式。
2）HTable对象中主要定义了增加行、删除行方法，并且以当前行的Index作为参数。
3）暂未考虑现实序号，由于动态选择删除行，需要重新绘制序号，增加了额外工作量，所以仅在顶部展示目前以增加的数量。
3、将动态表格中的数据行转成JSON数组的形式提交到后台。
//原生JS的方式实现构建JSON数组
$.fn.parseFormJSON = function (){
var result = [];
var json = {};
var data = this.serializeArray();
if(data.length==0){
return [];
}else{
for(var i=0; i说明：1）可使用原生的JS方式实现组装成JSON数组；2）亦可以参考jquery.serializeJSON的实现方式，但此种方式提交的数据为JSON对象，需要到后台再进行一次转换才行。
ADD_TR:function(trNum){
var IsNullHtml = "";
var IsShareHtml = "";
var ShareTypeHtml = "";
var IsPublicHtml = "";
var PublicTypeHtml = "";
var result = ""+
""+IsNullHtml+" "+
""+IsShareHtml+" "+
""+ShareTypeHtml+" "+
""+IsPublicHtml+" "+
""+PublicTypeHtml+" "+
"删除 "+
" ";
this.trNum++;
this.count++;
$("#count").text(this.count);
return result;
},
TR_ROW:function(trNum,trHtml){
}