javascript - 使克隆的 png 可拖动 Jquery

Question

这是我第一次使用javascript。我正在尝试使该图像可拖动。现在，原始 png 是可拖动的。我单击一个按钮来克隆图像，这可以工作，但克隆不可拖动。请帮忙!非常感谢您抽出时间。

$(function() {
  $(".draggable").draggable();
});




$(document).ready(function() {
  $("button").click(function() {
    $("body").append($("section:first").clone().addClass('drag(event)'));
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<div id="div1">
  <img src="http://i.imgur.com/kOOsSXe.jpg">
</div>

<section class="draggable" class="ui-widget-content">
  <img src="http://i.imgur.com/RWdfFRO.png" ondragstart="drag(event)" width="50" height="130" draggable="true"> </section>

<button>Tank Man</button>

Answer 1

可能是因为你没有使用这段代码使其可拖动

$( ".draggable").draggable();

所以我建议你像这样修改你的代码

$(document).ready(function(){
    $("button").click(function(){

 var element=$("section:first").clone().addClass('drag(event)');       
$("body").append(element);
element.draggable();
 });