通過雙擊刪除jQuery克隆的幫助對象

Question

我希望能夠通過雙擊它來刪除克隆的幫助對象。

我有以下的javascript代碼：

$(document).ready(function(){ 
    $(".draggable").draggable({ 
     helper: 'clone', 
     start: function (event, ui) { 
      ui.helper.animate({ 
       width: 200, 
       height: 200 
      }); 
     }, 
     cursorAt: {left:50, top:50} 
    }) 
     .on('dragstop', function(event, ui) { 
     $(this).after($(ui.helper).clone().draggable({cursor:'move'}).resizable());}); 

}); 

這裏是一個jsFiddle。拖動紅色方塊創建一個克隆。我現在希望通過雙擊刪除克隆，但迄今爲止所有嘗試都失敗了。

非常感謝

Answer 1

要刪除，我們只需要使用$(this).remove()的元素。試試下面的代碼，使其工作：

.on('dragstop', function (event, ui) { 
    $(this).after($(ui.helper).clone().addClass('removable').draggable({ 
     cursor: 'move' 
    }).resizable()); 

    $('.removable').dblclick(function() { 
     $(this).remove(); 
    }); 
}); 

的jsfiddle：here