jQuery UI Draggable and Resizable 1点击后停止工作[重复]

Question

我这里有个小提琴：https://jsfiddle.net/dfaunce/L3j1qmpu/5/

如果您单击任何项​​目框，它将将该框放入容器中（右侧的空白区域）。 目标是使容器中的框既可拖动又可调整大小。

• jQuery UI 可调整大小的句柄显示在框中，但它什么也没做。
• 您只能拖动该项目一次。之后，盒子什么也不做。

我在这里做错了什么？

$(function() {
    var $container = $("#container"),
        $objects = $("#objects");

    $(".box-selectable").on("click", function() {
        var $g = $(this).clone(true, true);
            $g
              .removeClass("box-selectable")
              .addClass("draggable resizable")
              .appendTo($container)
              .resizable()
              .draggable();
  
        $(this).remove();    
    });  
});

Answer 1

好吧，我想通了……

如果我将方法更改为：

$(document).on("click", ".box-selectable", function() { .... `

一切正常。

我不知道为什么，但确实如此......