Question

我遇到了jQuery sortable的问题。

以下是实例：JSFiddle

HTML：

<div class="a">
  <div class="b">
    a<br>
    b<br>
    c<br>
    d<br>
    e<br>
    f<br>
    g<br>
    h<br>
    i<br>
    j<br>
    k<br>
    l<br>
    m<br>
    n<br>
    o<br>
  </div>
</div>

JS：

$(function(){
    $('.a').sortable();
});

CSS：

.b {
  border: 1px solid;
  width: 100px;
  height: 100px;
  overflow-y: scroll;
  overflow-x: hidden;
  text-align: center;
}

在这种情况下，我有滚动的div。我滚动到div的末尾，我尝试使用drag＆amp; drop对元素进行排序。执行此操作后，滚动div会跳转到此div的开头。如何“记住”滚动的位置并在排序后“恢复”它？

Answer 1

您需要保存滚动位置，然后在停止移动对象时重新应用它。

JSFIDDLE：JSFIDDLE

$(function(){
    var scrollTop = 0;
    $('.a').sortable({
        start: function(event, ui){
          scrollTop = ui.item.scrollTop();
        },
        stop: function(event, ui){
          ui.item.scrollTop(scrollTop);
        }
    });
});

Answer 2

您应该在内部sortable()上使用<div id="b">方法，并将要排序的每个元素放在<div>标记内，以便将它们视为DOM元素。这是一个有效的解决方案JSFiddle 您可能需要查看THIS主题。

UI可排序移动滚动

2 个答案: