Question

我正在实现一个拖放代码，我现在拥有的是6个可拖动和可丢弃的图像，这个代码的作用是当图像被拖到另一个图像上时它们也交换了所有图像交换位置（如我尝试做的只是交换两张图像的位置，剩下的就是其余的。

任何帮助表示感谢，谢谢

Answer 1

它似乎对我有用，当我将图像拖到我放在上部div中的另一个图像时，它看起来很好，它将替换上部div中的图像，并且替换的图像被添加到另一个的末尾图片。可能我并不完全理解你在寻找什么...

我确实注意到这行末尾缺少一个半冒号：

$("#circles").droppable({
    accept: '.circles'
})

$("#circles").droppable({
    accept: '.circles'
});

编辑：如果您希望元素保留在某个位置，则需要将参数定义到它们应包含的位置。目前它们基本上是相互浮动的，除非您正在排序或严格确定他们居住的参数。

您可以在CSS中定义div大小以将图像包含到某个区域中，这可以帮助您解决问题。

div-name {
   height: 150px; 
   width: 150px;
}

这允许图像保持约束到某个区域，因此它们不会简单地在页面中相互浮动。

Answer 2

只需使用.sortable()：

$(document).ready(function() {
    $("#inventory").sortable();
});