jQuery scrollbar 插件 (mCustomScrollbar) 不会在 AJAX 回调时重新初始化



我目前正在尝试实现一个包含一年中月份的下拉列表,其中用户单击一个月将通过.load((加载适当范围的图库图像。

AJAX 调用本身有效,但我无法让我的插件在回调时重新初始化,即滚动条没有加载。更让我困惑的是,只有当我之前没有在我的 main 中使用插件时,滚动条才会加载回调.js .

我正在使用mCustomScrollbar插件。

这是 HTML:

<!-- Release Calendar Month Dropdown -->
    <div id="dropdown-release">
        <ul>
            <li>
                Month
                <ul>
                    <li id="nov14">November 2014</li>
                    <li>December 2014</li>
                    <li>January 2015</li>
                    <li>February 2015</li>
                </ul>
            </li>
        </ul>
    </div>
<div class="gallery"> <!-- ---------- GALLERY BEGINS ------------ -->
        <div class="hidden" id="gallery-note">
            <p><strong>Note:</strong> Tap gallery items to open<br/>in new tab</p>
        </div>  
        <div class="gallery-img">
            <a href="http://www.sneakersnstuff.com/en/product/16752/sneakersnstuff-reebok-inferno-15-stars" target="_blank">
                <img class="lazy" src="img/loader.gif" delayedsrc="http://pngsneakerstuff.cachefly.net/images/105882/premium_full.jpg" />
            </a>
            <p class="imgDescription">November 22nd</p>
            <span class="hidden">20141122</span>
        </div>
        <div class="gallery-img">
            <a href="http://sneakernews.com/2014/11/13/bait-x-brooks-chariot-centennial-release-date/" target="_blank">
                <img class="lazy" src="img/loader.gif" delayedsrc="http://cdn.sneakernews.com/wp-content/uploads/2014/11/bait-brook-chariot-centennial-3.jpg" />
            </a>
            <p class="imgDescription">November 22nd</p>
            <span class="hidden">20141122</span>
        </div>
.........etc

这是我的主要.js:

// within $(document).ready...
var galleryScroll = $(window).load(function() {
    $(".gallery").mCustomScrollbar({
        axis: "x",
        advanced: { autoExpandHorizontalScroll: true }
    });
});
$('#nov14').click(function() {
    $(".mCSB_container").load("releases/november/nov.html",function(response,status,xhr){
        $(".gallery").mCustomScrollbar("update");
    });
});

我也尝试通过 .ajaxComplete 解决问题,但未成功,如此处的建议。多年来一直被困在这最后一点上,帮助将不胜感激!:)

从您链接的插件站点:

更新

Usage $(selector).mCustomScrollbar("update");

这可能是您想在回调中调用的内容,而不是再次设置整个内容。

最新更新