jQuery UI 可排序连接列表 - 当项目滚动到新列表时不会触发 Over 事件

Question

尝试创建类似于 iPhone 的类似排序功能。我注意到当项目是 "scrolled into" 连接列表时，连接列表不会立即检测到可排序的项目。

看看这个 JSFiddle. You will notice that the over event 当第一个列表中的可排序项目滚动到第二个列表时，不会立即触发。在触发事件之前，您必须先移动鼠标。当您在触发事件之前松开鼠标时，这会成为一个问题，这会将项目保留在第一个列表中。这是 jQuery 错误吗？有什么解决办法吗？

这是我的 javaScript:

$(function () {
$("#sortable1, #sortable2").sortable({
    connectWith: ".connectedSortable",
    over: function () {
        alert("Over");
    },
    start: function () {
        $("#wrapper").animate({
            'scrollLeft': '+=330px'
        });
    },
    scroll: false
}).disableSelection();

});

请注意，我确实想使用 jquery ui 可排序滚动选项。页面应自行滚动到正确的位置。

非常感谢任何帮助。谢谢！

Answer 1

您可以等到 scroll 动画并将 placeholder 放置在新的 sortable 中。像这样：

 start: function (e, ui) {
            var cur_helper = ui.placeholder
            $("#wrapper").animate({
                'scrollLeft': '+=330px',

            }, function () {
                //you place it before equivalent position in sortable1
                $('#sortable2 > li').eq(ui.item.index()).before(cur_helper)

            });
        },

Fiddle: https://jsfiddle.net/um9vggb1/2/

jQuery UI 可排序连接列表 - 当项目滚动到新列表时不会触发 Over 事件

jQuery UI Sortable Connected List - Over event not fired when item is scrolled into new list

javascript

jquery

jquery-ui

jquery-ui-sortable