当 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

来自 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 类保留在所有区域中）