jquery - 影响元素克隆的html结构

Question

所以，我在父元素中有一堆元素:

<div class="copyFrom">
    <div class="copyThese">copyThese1</div>
</div>
<div class="copyFrom">
    <div class="copyThese">copyThese2</div>
</div>

另外，我有 separate .Parent 元素，我在其中附加 .copyHere 元素以对应 .copyFrom< 的数量 元素

<div class="Parent">
    <div class="copyHere"></div>
    <div class="copyHere"></div>
</div>

Aaaalso，在 .copyHere 中，我克隆了每个单独的 .copyThese 元素

<div class="Parent">
    <div class="copyHere">
        <div class="copyThese">copyThese1</div>
    </div>
    <div class="copyHere">
        <div class="copyThese">copyThese2</div>
    </div>
</div>

现在，问题是:

出于某种原因，如果 .Parent 低于 所有 .copyFrom 元素 .copyThese 元素是克隆进去就好了。

但是..如果.Parent元素在之上.copyFrom元素，克隆.copyThese元素失控。

我需要在上方和下方都有 .Parent 元素。(没有奇怪的克隆问题。)

jsfiddle:

http://jsfiddle.net/lollero/mZhUG/2/ - 以上 - 正确

http://jsfiddle.net/lollero/mZhUG/3/ - 下面 - 问题

Answer 1

你应该这样做:

  var copyThese = $('.copyFrom .copyThese');

因为您在每次迭代中都添加了 .copyThese 元素并不断克隆相同的元素。如果您在 dom 中已经存在的元素之后添加元素，则不会发生这种情况，因此仅当 .parent 被添加到

之前时，问题才会出现

在这里摆弄:

http://jsfiddle.net/mZhUG/4/