- it技术
- js 动态添加删除表单元素
<form id="form" role="form" method="post" class="custom-control">
<div class="form-inline">
<label for="details" class="custom-control-label col-md-2">还款明细
</label>
<button type="button" class="button btn-light" id="add-btn" onclick="add_div()">添加明细
</button>
<button type="button" class="button btn-light" id="del-btn" onclick="del_div()">删除明细
</button>
</div>
<div class="form-group" id="details">
<div class="form-group" >
<label class="form-label">游戏截图:
</label>
<input type="text" name="jjkjk" value="888">
</div>
</div>
</form>
<script type="text/javascript">
var detail_div = 1;
function add_div() {
var e = document.getElementById("details");
var div = document.createElement("div");
div.className = "form-group";
div.id = "details" + detail_div;
div.innerHTML = e.innerHTML;
document.getElementById("form").appendChild(div);
detail_div++;
}
function del_div() {
var id = "details" + (detail_div - 1).toString();
var e = document.getElementById(id);
document.getElementById("form").removeChild(e);
detail_div--;
}
</script>
