1

我已经在我的项目中实现了可排序的 jQuery UI。在我的实现中,我有大量记录,平均约为 10,000 条。我将每条记录的索引存储在我的数据库中。

实现工作正常,但由于 mCustomScrollbar,排序功能非常生涩。当我到达最后一个可见记录时,滚动无法正常工作。我在这里创建了我的实现示例。

我缺少 mcustomscrollbar 中的任何属性。我将以下代码用于自定义滚动条:

<script>
    (function($){
        $(window).on("load",function(){

            /* call mCustomScrollbar function before jquery ui sortable() */

            $("#sortable").mCustomScrollbar({
                scrollbarPosition:"outside",
                scrollInertia:450,
                theme:"light-2"
            });

            $("#sortable ul").sortable({
                axis:"y",
                cursor:"move",
                tolerance:"intersect",
                change:function(e,ui){
                    var h=ui.helper.outerHeight(true),
                        elem=$("#sortable .mCustomScrollBox"),
                        elemHeight=elem.height(),
                        moveBy=$("#sortable li").outerHeight(true)*3,
                        mouseCoordsY=e.pageY-elem.offset().top;
                    if(mouseCoordsY<h){
                        $("#sortable").mCustomScrollbar("scrollTo","+="+moveBy);
                    }else if(mouseCoordsY>elemHeight-h){
                        $("#sortable").mCustomScrollbar("scrollTo","-="+moveBy);
                    }
                }
            });

        });
    })(jQuery);
</script>

更新

我还实现了 Kendo Sortable 以及完美的滚动条,但它也不起作用。与 Kendo Sortable 的 Plunker 链接在这里

4

0 回答 0