<div class="form-item-line">
<div class="line-tit">主要排放物或污染源</div>
<div class="line-table">
<table class="layui-table expand-table" id="yypfwhwry">
<colgroup>
<col width="60">
<col>
<col>
<col width="130">
<col width="135">
<col width="60">
<col width="60">
</colgroup>
<thead>
<tr>
<th>序号</th>
<th>污染物形态</th>
<th>污染物名称</th>
<th>污染物排放浓度</th>
<th>污染物排放量/日</th>
<th>单位</th>
<th><i class="gyyq-iconfont table-add"></i></th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
<div id="hide-container" style="display: none;">
<table class="yypfwhwry">
<tr class="data-row">
<td class="order"></td>
<td><input type="text" class="layui-input" /></td>
<td><input type="text" class="layui-input" /></td>
<td><input type="text" class="layui-input" /></td>
<td><input type="text" class="layui-input" /></td>
<td><input type="text" class="layui-input" /></td>
<td><i class="gyyq-iconfont table-delete"></i></td>
</tr>
</table>
</div>
</body>
<script type="application/javascript">
$(function(){
$('table.expand-table .table-add').on('click', function () {
var $table = $(this).closest('table');
var id = $table.attr('id');
var $tr = $('#hide-container').find('.' + id).find('tr').clone(true);
$table.append($tr);
resetRowNum($table);
});
$('table.expand-table').delegate('.table-delete', 'click', function () {
var $table = $(this).closest('table');
$(this).closest('tr').remove();
resetRowNum($table);
});
var resetRowNum = function (target) {
$(target).find('.data-row').each(function (i) {
$(this).find('.order').text(i + 1);
});
}
})
</script>
Jquery 写表单增加,删除行列
最新推荐文章于 2022-03-31 19:04:52 发布