Question

在克隆元素的下面的代码中，它克隆了先前添加的元素。拖动第二个元素时，它也会克隆第一个元素..总共会出现3个元素。如何克隆当前div？。

   $(document).ready(function($) {
    var a=0;
    $("div[id^='product']").draggable({
        helper: function () {
            return $("<div class='dragger'></div>").append($(this).clone().append("<button>remove</button>"));
        }
    });

    $("#dropcombo").droppable({
        drop: function (event, ui) {    
        a++;    
           $(this)
                .find("p")
                .text(a);
            var element = $('.ui-draggable-dragging');
            var currentDrop=$(this);
            return element.clone().appendTo(currentDrop);
        }
    });
    $(document).on('click', 'button', function(){
        $(this).parent().remove();

    });
  });

<div id="product1" class="draggable">
    <h1>AA</h1>
</div>
<div id="product2" class="draggable">
    <h1>AA</h1>
</div>
<div id="product3" class="draggable">
    <h1>AA</h1>
</div>
<div id="product4" class="draggable">
    <h1>AA</h1>
</div>
<div id="dropcombo">
    <h3>Drop packages to buy</h3>
    <div> you have selected <p>0</p> packages</div>
    <img id="imgg" src="images/Packages.png">
</div>

Answer 1

您必须先阅读jquery draggable

中的文档

然后通过为draggable定义事件来帮助自己。当两个案例事件中的拖动开始和拖动停止被触发时，首先定义这些回调，然后您需要使用具有所需操作的可拖动事件手动操作

如何选择当前的拖动元素？

1 个答案: