JQuery 可排序、可拖动和可拖放不协同工作

JQuery Sortable, Draggable and Droppable not working together

本文关键字：拖放 协同工作 拖动 排序 JQuery      更新时间：2023-09-26

我想创建一个照片组织者，您可以在其中对图像重新排序并将它们放入垃圾箱以将其删除。我的问题是，当您开始拖动图像时，它不再位于光标下方，向左约500px。我当前的代码 - http://jsfiddle.net/D4xQh/。

$("#currentImages").sortable();
$(".imgThumb", "#currentImages").draggable({
    connectToSortable: "#currentImages",
    helper: "original",
    revert: "invalid"
});
$("#trash").droppable({
  drop: function( event, ui ) {
    var $item=( ui.draggable );
    $item.fadeOut();
  }
});

我尝试删除可拖动部分，但这会导致图像被发送到垃圾箱以恢复到其原始位置，然后淡出。这使得它看起来非常不安，看起来也不专业。这就是没有可拖动选项的它 - http://jsfiddle.net/D4xQh/1/

JSFiddle 中的灰色框是"垃圾箱"

我不知道

这是否解决了您的问题，但您缺少revert参数：

$("#currentImages").sortable({
    revert: true
});

试试这个：http://jsfiddle.net/D4xQh/2/

相关文章：