jQuery滚动条插件(mCustomScrollbar)没有重新初始化AJAX回调

时间:2014-12-16 00:23:47

标签: javascript jquery html 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

这是我的main.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按照建议here尝试解决问题,但未成功。 多年来一直困在最后一点,帮助将不胜感激! :)

1 个答案:

答案 0 :(得分:2)

来自您关联的插件网站:

  

更新

     

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

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