js 动态给table添加、删除行。

1.添加table 行

function addtablTr() {
var $table = $("#abc");
var vTr = '<tr><td>选项名称:</td><td><input type="text" name="chooseName" size="20" maxlength="50" placeholder="请输入数据..." style="height: 27px;line-height: 27px;" class="easyui-validatebox text" required/></td>' +
'<td>选项值:</td><td><td><input type="text" name="chooseValue" size="20" placeholder="请输入英文字符或者数字..." style="height: 27px;line-height: 27px;" class="easyui-validatebox text" required/></td><td><a href="#" onclick="deleteRow(this)">删除</a></td></tr>';
$table.append(vTr);
$.parser.parse($table);
}


2.删除table 行
function deleteRow(obj) {
var table = document.getElementById("abc");
//删除第一行
// able.deleteRow(obj.parentNode.rowIndex);
//删除当前行
table.deleteRow(obj.parentNode.parentNode.rowIndex);
}

3.jsp:<div>
<table id="abc">
</table>
<a href="#" class="easyui-linkbutton" plain="true"
onclick="addtablTr()"><i
class="fa fa-plus-circle fa-lg fa-fw fa-col"></i>添加</a>
</div>

猜你喜欢

转载自www.cnblogs.com/lxjy201832/p/9254803.html