我目前正在尝试实施一个包含一年中几个月的下拉列表,用户点击一个月将通过.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尝试解决问题,但未成功。 多年来一直困在最后一点,帮助将不胜感激! :)
答案 0 :(得分:2)
来自您关联的插件网站:
更新
Usage $(selector).mCustomScrollbar("update");
这可能是您想要在回调中调用的内容,而不是再次设置整个内容。