jQueryUI可排序连接列表-当项目滚动到新列表中时,未触发Over事件

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

本文关键字:列表 事件 Over 新列表 连接 排序 项目 jQueryUI 滚动      更新时间:2023-09-26

尝试创建类似iPhone的排序功能。我注意到,当项目"滚动到"连接列表中时,可排序项目不会立即被连接列表检测到。

看看这个JSFiddle。您会注意到,当第一个列表中的可排序项目滚动到第二个列表时,over事件不会立即触发。在触发事件之前,您必须先移动鼠标。当您在触发事件之前放开鼠标时,这将成为一个问题,因为事件会将项目保留在第一个列表中。这是jQuery错误吗?周围有什么工作吗?

这是我的javaScript:

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

});

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

非常感谢您的帮助。谢谢

您可以等待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/