奇怪的行为 jquery 可在滚动时排序

Question

我正在构建管理项目的前端部分。现在我正在制作一个页面概览，您可以在其中对页面进行排序（作为列表）。我正在使用 jquery 插件 nestedSortable from here 来获得树视图功能。

我的问题：如果页面已经滚动，您开始 dragging/sorting 的项目定位为从鼠标向下滚动的像素数量，而不是应该在鼠标处滚动的像素数量（dragging/sorting 之前滚动）。

我的排序列表选项如下所示：

var ns = $('.sortable-list').nestedSortable({
  forcePlaceholderSize: true,
  handle: '.handle',
  helper: 'clone',
  items: 'li',
  opacity: .9,
  placeholder: 'sort-placeholder',
  revert: 250,
  tabSize: 15,
  tolerance: 'pointer',
  toleranceElement: '> div',
  maxLevels: 4,
  isTree: true,
  expandOnHover: 700,
  startCollapsed: true,
  stop: function() {
    updateList();
    setTimeout(updateList, 100);
  }
});

I also made a codepen thats illustrate my problem.

有谁知道如何解决这个问题？ - 提前谢谢你。

Answer 1

我认为这是 nestedSortable 库中的错误。 git 存储库上有一个提交表明它应该修复该错误 (https://github.com/ilikenwf/nestedSortable/commits/2.0alpha)，因此请尝试升级到最新版本，看看是否能解决您的问题。

更新：事实上，修改您的 CodePen 以使用最新版本的文件有效：http://codepen.io/anon/pen/yNPWKX.

我用于CodePen的nestedSortable源文件是：

<script src='http://mjsarfatti.com/sandbox/nestedSortable/jquery.mjs.nestedSortable.js'></script>

奇怪的行为 jquery 可在滚动时排序

Strange behavior jquery sortable on scroll

jquery

jquery-ui

jquery-ui-sortable

nested-sortable