在jQuery中使用remove（）後添加相同元素

Question

我正在使用此代碼在水龍頭上的一個潛水區域中添加點。 現在我想刪除舊的挖掘點來更新它，我正在使用jQuery remove()函數。 它工作正常，但在那之後它沒有向我展示那個div上的下一個分支點。

jQuery(document).ready(function() { 
    $("#test").click(function (e) { 
     $(".myimg").first().clone().offset({ 
      left: e.pageX, 
      top: e.pageY 
     }).appendTo('body'); 
    }); 
    $('.remove').click(function(){ 
     $('.myimg').remove(); 
    }); 
}) 

http://jsfiddle.net/szCAL/9/

Answer 1

您卸下主克隆元素，.myimg類，你需要保存作爲備份，因爲當你點擊該div時，你需要使用該img進行克隆，

這裏的code

我增加了一個類名到克隆的元素，並刪除與類名的點。

Answer 2

你可以只刪除克隆，像這樣：

jQuery(document).ready(function() { 
    var el = $('.myimg').first(); 
    $("#test").click(function (e) { 
     el.clone().offset({ 
      left: e.pageX, 
      top: e.pageY 
     }).appendTo('body').addClass("clone"); 
    }); 
    $('.remove').click(function(){ 
     $('.clone').remove(); 
    }); 
}) 

http://jsfiddle.net/szCAL/13/

Answer 3

如果您創建一個新的元素，而不是克隆，這個問題解決了它的自我，你可以擺脫第一惱人的元素：

jQuery(document).ready(function() { 
    $("#test").click(function (e) { 
     $('<img />', { 
      style : 'left: '+e.pageX+'px;top:'+ e.pageY + 'px;height: 10px;width:10px', 
      src  : 'http://www.nystce.nesinc.com/images/tests_circle.gif', 
      'class' : 'myimg' 
     }).appendTo('body'); 
    }); 
    $('.remove').click(function(){ 
     $('.myimg').remove(); 
    }); 
}); 

FIDDLE

Answer 4

你需要重新添加的元素爲了開始顯示位置

​​

結帳fiddle