Javascript 克隆div元素并使用相同的按钮操作原始元素和克隆?
我有一个元素,它有三个子元素Javascript 克隆div元素并使用相同的按钮操作原始元素和克隆?,javascript,jquery,Javascript,Jquery,我有一个元素,它有三个子元素element1,element2和element3 当我使用命令按钮1过滤器元素1 当我使用命令button2filterelement2 如何克隆此元素 并使用命令按钮1 我使用这个代码,但不工作 </script> <input type="button" id="btnClone" value="Clone Div" /> <script> $("#btnClone").bind('click', fun
element1
,element2
和element3
当我使用命令按钮1
过滤器元素1
当我使用命令
button2
filterelement2
如何克隆此元素
并使用命令按钮1
我使用这个代码,但不工作
</script>
<input type="button" id="btnClone" value="Clone Div" />
<script>
$("#btnClone").bind('click', function() {
$('#prueban2').clone(true).appendTo('body');
});
</script>
$(“#btnClone”).bind('click',function(){
$('#prueban2').clone(true).appendTo('body');
});
换句话说,我如何使用“原始”按钮在他的克隆中操作原始元素如果我理解正确,只需克隆元素,然后使用
.add()
方法对原始元素和克隆元素进行jquery选择,然后做任何你想做的事情
因此,我将使您的代码如下所示:
<input type="button" id="btnClone" value="Clone Div" />
<script>
$("#btnClone").bind('click', function() {
var $original = $('#prueban2');
var $clone = $original.clone(true);
$clone.appendTo('body');
// now manipulate original element with clone:
$original.add($clone).bind('click', function() { /* ... */ });
// ... or:
$original.add($clone).each(function(el) { /* ... */ });
});
</script>
CSS:
JS:
为我工作,虽然你的问题有点模糊。你们能澄清一下克隆和操纵原始元素的确切含义吗。参见fiddle示例第一个按钮“指挥官”在我的代码中使用此过滤器此过滤器仅影响原始元素而不影响克隆人换句话说,我如何使用原始按钮操纵克隆人中的原始元素是的,我认为这很好,但是不存在没有克隆的任何方法按钮仅使用原始操作两个元素(原始和克隆)button@braveheart,另一种方法是在html中预先定义这两个元素。请查看我答案中的添加内容以了解详细信息。如果您无法更改html,那么克隆听起来是最好的方法。
<div id="preuban2"></div>
<div id="preuban2-1" class="hidden"></div>
.hidden {
display: none;
}
$('#btnClone').click(function() {
$('#preuban2-1').removeClass('hidden');
// manipulate both elements
$('[id^=preuban2]').bind('click', function(){ /*...*/ });
}