如何在不丢失第一次初始化中添加的功能的情况下重新初始化 jScrollPane？

Question

我在使用 jScrollPane 的 reinitialise() 方法时遇到了问题。每当我调用它时，我在第一次初始化中实现的东西都会停止工作...

在我当前的代码中，我正在做这样的事情：

$('.scrollable').each(function(){

    var e = $(this),
        parent = e.parent();

    e.jScrollPane({
        // parameters
    });

    var api = e.data('jsp'),
        arrowup = e.find('.jspArrowUp'),
        arrowdw = e.find('.jspArrowDown');

    if ( api.getIsScrollableV() ) {
        e.addClass('scrolled-top');
        parent.addClass('scroll-parent');
    }

    e.scroll(function(){
        var scrbef = api.getContentPositionY(),
            scrmax = api.getContentHeight() - this.clientHeight,
            scraft = scrmax - scrbef,
            dlayup = (scrbef - 220)/100,
            dlaydw = (scraft - 220)/100,
            opacup = dlayup > 1 ? 1 : dlayup < 0 ? 0 : dlayup,
            opacdw = dlaydw > 1 ? 1 : dlaydw < 0 ? 0 : dlaydw;

        if ( scrbef === 0 ) {
            e.addClass('scrolled-top').removeClass('scrolled-bot');
        } else if ( scraft === 0 ) {
            e.addClass('scrolled-bot').removeClass('scrolled-top');
        } else {
            e.removeClass('scrolled-top scrolled-bot');
        }

        arrowup.css('opacity', opacup);
        arrowdw.css('opacity', opacdw);
    });

到目前为止，还不错。它的作用是：

在 .scrollable 个元素上初始化 jScrollPane
根据内容位置，添加或删除scrolled-top或scrolled-bot类.
根据内容的位置控制箭头的不透明度（顶部和底部有很多填充，所以我只希望箭头在实际内容出现时出现已到达屏幕边界）。

在那之后，我有这个：

    var throttleTimeout;

    $(window).resize(function(){
        if ( !throttleTimeout ) {
            throttleTimeout = setTimeout( function(){
                    api.reinitialise();

                    throttleTimeout = null;
                }, 500
            );
        }
    });

    $('.deployer').click(function(e){
        api.reinitialise();
    });
});

现在，这很简单；调整 window 大小时重新初始化的代码直接来自文档。

然而，一旦 reinitialise() 被调用，那么在调整 window 的大小或点击 .deployer 元素后，之前控制箭头的不透明度停止工作 – 尽管很奇怪，scrolled-top 和 scrolled-bot 类仍然可以正确添加或删除。

有谁知道可能导致此行为的原因以及如何解决它？

干杯。

Answer 1

发现发生了什么。

每当您重新初始化时，基本上所有内容都会被重置，因此之前存储在 arrowup 和 arrowdw 中的元素不再存在。添加

var arrowup = e.find('.jspArrowUp'),
    arrowdw = e.find('.jspArrowDown');

在每个 reinitialise() 成功后再次出现。

如何在不丢失第一次初始化中添加的功能的情况下重新初始化 jScrollPane？

How to reinitialise jScrollPane without losing features added in the first initialisation?

javascript

jquery

jscrollpane

jquery-jscrollpane