從一個DIV移動一個項目到另一個，然後再返回使用jquery

項目1

<div id=i2><span id=e2>Item 2</span></div>

當我點擊第1項予以刪除，並轉移到i2和當我點擊項目1再次它必須回到I1從一個DIV移動一個項目到另一個，然後再返回使用jquery

是的，我試過append()，它關係到I2，但再次單擊它並沒有遷回I1

我要如何做到這一點。

由於讓

來源

2010-03-09 X10nD

刪除後無法點擊項目1 - 可能是您的意思_when我再次單擊項目2時__ – Amarghosh 2010-03-09 06:45:12

單擊項目1，它將移動到i2，將i1留空或與其他項目一起使用 – X10nD 2010-03-09 06:48:28

您能用HTML術語來描述嗎？你想要什麼？也就是說，在你點擊第1項後，如果用HTML表示，整個事情會是什麼樣子？再次，在你「再次點擊物品1」之後它會是什麼樣子？ – BobS 2010-03-09 06:48:59

<script type="text/javascript"> 
$(function(){ 

    $("#i1").toggle(function(){ 
     $("#e1").appendTo("#i2"); 
    }, 
    function(){ 
     $("#e1").appendTo($(this)); 
    }); 
}); 
</script> 
<div id=i1><span id="e1">Item 1</span></div> 
<div id=i2><span id="e2">Item 2</span></div>

這將重複兩次點擊的操作。對於第一次單擊e1將被附加到i2，對於第二次單擊相反的情況發生，第三次單擊它將重複第一次單擊操作等等。

如果要附加點擊事件跨度那麼你可以做這樣的

$("#e1").toggle(function(){ 
     $(this).appendTo("#i2"); 
    }, 
    function(){ 
     $(this).appendTo($("#i1")); 
    });

如果你有重複元素，那麼你可以給他們一個類名

<script type="text/javascript"> 
$(function(){ 

    $("span.clickspan").toggle(function(){ 
     $(this).appendTo("#i2"); 
    }, 
    function(){ 
     $(this).appendTo($("#i1")); 
    }); 
}); 
</script> 
<div id=i1> 
    <span id="e1" class="clickspan">Item 1</span> 
    <span id="e2" class="clickspan">Item 1</span> 
    <span id="e3" class="clickspan">Item 1</span> 
    <span id="e4" class="clickspan">Item 1</span> 
    <span id="e5" class="clickspan">Item 1</span> 
</div> 
<div id=i2><span id="e6">Item 2</span></div>

看到一個working demo。

來源

2010-03-09 07:02:21 rahul

@rahul 假設每個＃i1和＃i2中有100個e + i。謝謝讓 – X10nD 2010-03-09 07:05:45

謝謝................... – X10nD 2010-03-09 07:28:57

由於文本「項目1」變成對DIV（I 2）的一部分。

來源

2010-03-09 06:52:52 hallie

@hallie：對，我可以做到這一點，現在我該如何將它移回i1，並使用相同的ID。 – X10nD 2010-03-09 06:54:03

請看看我編輯過的問題，爲每個項目1和項目2添加帶有標識的span。 – X10nD 2010-03-09 07:00:31

她只是移動「項目1」的div內容。再次將文本移回div（i1）將需要分割div（i2）的文本內容。 – hallie 2010-03-09 07:01:42

從一個DIV移動一個項目到另一個，然後再返回使用jquery

回答

相關問題