jquery克隆函数宽度一个addClass嵌套
克隆div后,我无法选择我的选项 克隆后,我希望能够选择选项并给出所选的类。因此,每个克隆的div都有一个已选择的选项 请检查我的演示并尝试克隆 Jqueryjquery克隆函数宽度一个addClass嵌套,jquery,clone,Jquery,Clone,克隆div后,我无法选择我的选项 克隆后,我希望能够选择选项并给出所选的类。因此,每个克隆的div都有一个已选择的选项 请检查我的演示并尝试克隆 Jquery var cloneCount = 0; $("#add-address").click(function() { $("#to-add-address").clone() .attr("id", "to-add-address_Clone" + cloneCount) .insertAfter(
var cloneCount = 0;
$("#add-address").click(function() {
$("#to-add-address").clone()
.attr("id", "to-add-address_Clone" + cloneCount)
.insertAfter("#to-add-address");
$("#clone", "#to-add-address_Clone" + cloneCount)
.attr("id", "clone_Clone" + cloneCount);
cloneCount++;
$('.options li a').bind('click',function () {
$('.options li a').removeClass('selected');
$(this).addClass('selected');
});
});
HTML
<ul>
<li id="to-add-address" class="outerDiv address" >
<div id="clone">
<label><input type="text" value="Address"><span class="input-edit"></span></label>
<label><input type="text" value="Address 2"><span class="input-edit"></span></label>
<label><input type="text" value="Town"><span class="input-edit"></span></label>
<label><input type="text" value="Contry"><span class="input-edit"></span></label>
<label><input type="text" value="Post Code"><span class="input-edit"></span></label>
<ul class="options">
<li class="home"><a href="javascript:void(0);">home</a></li>
<li class="work"><a href="javascript:void(0);">work</a></li>
<li class="other"><a href="javascript:void(0);">other</a></li>
<li class="delete"><a href="javascript:void(0);">delete</a></li>
</ul>
</div>
</li>
</ul>
<a href="javascript:void(0);" id="add-address">clone</a>
-
您可以将其更改为仅影响该克隆中的元素:
$(this).closest(".options").find('li a').removeClass('selected');
此外,每次单击都会重新绑定,导致每个元素上的侦听器数量随着每个克隆的增加而增加,请改用事件委派:
$(document).on("click", '.options li a',function () {
var $this = $(this);
$this.closest(".options").find('li a').removeClass('selected');
$this.addClass('selected');
});
如果您的真实代码有一个共同的父级,请使用相应的选择器替换文档
您可以再次使用
最近的
查找具有给定选择器的最近祖先。可能是$(this).closest(.outerDiv”).remove()
。在这个小提琴上,“删除”正在删除所有的div,我不能再克隆了。你知道吗?因为你已经把它设置为在点击任何链接时运行,而不仅仅是删除链接。你的克隆依赖于第一个存在,如果你删除它,克隆将不再工作。谢谢你的建议,现在正在工作,但我怎么能只保留一个div?