当Jquery jScrollPane被重新初始化时，它会回到顶部.为什么

Question

我使用jquery库jScrollPane为整个页面设置自定义滚动条。

scroll_bar = $('body>div').jScrollPane(
     {
        autoReinitialise: true,
            showArrows: true,
            maintainPosition: false
     }).data('jsp');

当在页面底部添加新内容时(当用户在页面底部时)，我调用:

scroll_bar.getContentPane().find(".content").append(some_content);
scroll_bar.reinitialise();

这将重新初始化滚动条，但它将用户带到页面的顶部。我希望窗户保持在原来的位置。有解决方案吗?

Answer 1

您确定您正在获得所需的数据吗?我不知道这是否有效，但是您是否尝试过:

scroll_bar = $('body>div').jScrollPane(
   {
      autoReinitialise: true,
          showArrows: true,
          maintainPosition: false
   });
scroll_bar.data('jsp');

通常你不会使用。scroll-pane类来做这个，而不是body>div选择器吗?

我想也许应该是这样的:

var api = scroll_bar.data('jsp');
api.reinitialise();

Answer 2

如果你想要滚动条保持它的位置，你应该设置

      maintainPosition: true

同样，试着像这样重构代码:

            // Use jscrollpane api function to enable reinitialization
            var scrollelement = $('body>div').jScrollPane({ maintainPosition: true});
            var api = scrollelement.data('jsp');
            api.getContentPane().html(result);

            // Needed to apply jscrollpane after change new container type
            api.reinitialise();

希望有帮助

Answer 3

From the docs:

• maintainPosition [boolean] -是否希望滚动窗格的内容在重新初始化时保持其位置-因此当添加更多内容时它不会滚动(默认为true)

设置为false

Answer 4

对于在上面的代码之后重新初始化有问题的人:

function reinitialiseScrollpane() {
        var settings = {
            maintainPosition: true,
            // add your settings here, below are examples
            arrowButtonSpeed: 1,
            showArrows: true,
            animateScroll: true 
        };
    pane.jScrollPane(settings); 
    var api = pane.data('jsp');
    api.getContentPane().append();
    api.reinitialise();
}

重要的部分是使用设置。如果不重新初始化设置，它可能会出现故障。我把它放在一个函数调用中，所以只要在任何滚动窗格中的内容发生变化(假设所有区域都保留了。scroll-pane类)，就可以调用它