HTML結構影響元件克隆

所以，我有一堆元素的父元素內：HTML結構影響元件克隆

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

另外，我有單獨.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/ - 下面 - 問題

來源

2011-10-20 Joonas

很好格式化的問題:) – jackJoe

我不明白你想要創建什麼html –

@NicolaPeluchetti我不確定你可以幫助我，如果你沒有從問題中發現的話。 – Joonas

這是因爲你添加新每個迭代需要.copyThese個元素。

copyThese.eq(copyHere).clone().appendTo($(this));

你克隆nth元素，但你已經添加上述n元素，所以即使你的索引是增加你還在克隆同一div。

$('.copyHere').each(function(){ 
    var copyHere = $(this).index(); 

    // you re-initialise this array within each loop, 
    // elements are added to the start of the array each time 
    var copyThese = $('.copyThese'); 

    copyThese.eq(copyHere).clone().appendTo($(this)); 
});

改變這一點，它的工作原理：

copyThese = $('.copyThese'); 

$('.copyHere').each(function(){ 
    var copyHere = $(this).index(); 
    copyThese.eq(copyHere).clone().appendTo($(this)); 
});

你看到的區別？我可能沒有解釋得很好，但希望你能看到問題。

來源

2011-10-20 11:38:07 fearofawhackplanet

是的，我覺得這樣一個傻子問一個問題，真的有一個很簡單的問題，我一直試圖解決幾個小時。 – Joonas

@洛萊羅它發生在我們所有人身上！ – fearofawhackplanet

你應該做的：

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

，因爲你要添加在每次迭代.copyThese元素和保持克隆相同的元素。如果添加了一個後的元素已經存在於DOM，因此只有當.parent被前置

小提琴這裏的問題是，目前這不會發生：

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

來源

2011-10-20 11:38:42

+1簡單和一線解決方案。 – punit

我會用fearofawhackplanet的答案，但因爲這項工作，我不知道如果我必須回來使用這個..我會給你+ 1 – Joonas

+1這是一個很好的答案。我只是試圖說明問題出在哪裏，而不是提出確切的答案。 – fearofawhackplanet

HTML結構影響元件克隆

回答

相關問題