如何在jQuery中将拖放的元素放入div中

Question

我想要做的就是在拖拽成功后将拖拽的元素适应父元素(dragabble div和droppable元素具有相同的宽度和高度)

有人能告诉我如何“匹配”这两个元素吗？

我的droppable代码是这样的：

$(function() {
     $( ".cells" ).droppable({
          accept: "#image",
          activeClass: "hovered",
          hoverClass: "active",
          drop: function( event, ui ) {
             }
           });
});

Answer 1

第一个解决方案是使用fit

$( ".selector" ).droppable({ tolerance: "fit" }); //Draggable overlaps the droppable entirely.

第二个方法是修改可拖动元素的顶部和左侧属性，使其通过.css与父元素匹配

$(function() {
     $( ".cells" ).droppable({
          accept: "#image",
          activeClass: "hovered",
          hoverClass: "active",
          drop: function( event, ui ) {
          draggable.css("top",droppable.css("top"))
          draggable.css("left",droppable.css("left"))
             }
           });
});

Demo