jQuery实现div复制
页面源码:
</div>
<div class="condition">
<select class="select">
<c:forEach var="field" items="${fields}">
<option class="option" id="${field}"></option>
</c:forEach>
</select> <input name="text" type="text" class="searchvalue"/>
<button class="add">+</button>
<button class="remove">-</button>
</div>
效果如下:
点击“+”按钮,复制一个“condition”div,点击“-”按钮移除当前div,jQuery实现代码:
$(document).ready(
function() {
//添加选项
$(".add").click(function() {
var sourceDiv = $(this).parent();//获取要复制的节点
var duplicate = sourceDiv.clone(true);
//将文本清空
duplicate.find("input[name=‘text‘]")[0].value = "";
duplicate.insertAfter(sourceDiv);
});
//删除按钮
$(".remove").click(function() {
var soureDiv = $(this).parent();//获取要移除的节点
//如果只有一个则不移除
if ($(".condition").length != 1) {
soureDiv.remove();
}
});
});
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。