效果如圖：
這里我用的是layui的靜態表格，其他框架也是一樣的（只要你都表單元素要通過js進行渲染），我的需求是在表單中放了表格的元素，表格中還有表單的元素。表格中的行數據是js動態添加的，正常的添加直接拼接進去就可以了效果就能出來，因為我是放到表單里邊的，所以最后還要在js代碼后邊引入一次form表單的渲染；奇怪的渲染之后還沒有生效，想了一下應該是在表單進行渲染的時候js還沒有去添加行數據，所以沒有渲染到，然后手動渲染了一下。果然，效果出來了。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" href="layui/css/layui.css" />
<script src="js/jquery-3.3.1.js"></script>
<script type="application/javascript" src="layui/layui.js"></script>
</head>
<body>
<form class="layui-form">
<div>
<table id="principleDetail" class="layui-table" lay-size="sm">
<colgroup>
<col width="150">
<col width="200">
<col>
</colgroup>
<thead>
<tr>
<th>昵稱</th>
<th>加入時間</th>
<th>簽名</th>
</tr>
</thead>
<tbody id="info">
</tbody>
</table>
</div>
</form>
</body>
<script>
//如果這里的數據是通過后台傳過來的，記得手動渲染下
var index = 1;
$('#info').append("<tr id=" + index + "><td align='center'>" + "七月七的雪" + "<td align='center'><select><option value=''>請選擇</option></select></td> <td><input type='text'></td></tr>");
layui.use('form',function () {
var form = layui.form;
//手動渲染
form.render();
})
</script>
</html>