我的代碼在視窗加載時作業正常，我已將它放在一個函式中以在 ajax 之后重置內容寬度。我的問題是使內容能夠滑動的錨在 Ajax 之后停止作業。任何想法我做錯了什么？
這是我的代碼：
function slideMyContent(){
$(document).find('.selector').each( function(){
var $slider = $(this),
$sliderContainer = $slider.find(".slider-container"),
$sliderList = $slider.find('.slider-list'),
$sliderItem = $slider.find('.slider-item'),
$sliderItemInner = $slider.find('.slider-item-inner'),
$sliderItemInnerEmpty = $slider.find('.slider-item-inner:empty'),
$sliderButton = $slider.find('.slider-button'),
$prevButton = $(document).find('.slider__button--prev'),
$nextButton = $(document).find('.slider__button--next'),
setItemWidth = function(){
// some codes to set content width which works fine even after Ajax
},
slide = function(){
var $button = $(this),
dir = $button.data('dir'),
curPos = parseInt($sliderList.css('left')) || 0,
moveto = 0,
containerWidth = $sliderItemInner.length ? $sliderContainer.innerWidth() 1 : $sliderContainer.innerWidth(),
listWidth = $sliderList.innerWidth(),
before = (curPos containerWidth),
after = listWidth (curPos - containerWidth);
if(dir=='next'){
moveto = (after < containerWidth) ? curPos - after : curPos - containerWidth;
$prevButton.toggle(moveto != 0);
$nextButton.toggle(after > containerWidth);
} else {
moveto = (before >= 0) ? 0 : curPos containerWidth;
$prevButton.toggle(moveto != 0);
$nextButton.show();
}
$sliderList.animate({left: moveto});
};
$(window).resize(function(){
setItemWidth();
slide();
});
setItemWidth();
$sliderButton.on('click', slide); // This is where I have a problem (Not woking after Ajax)
});
}
uj5u.com熱心網友回復：
謝謝大家。我最終slide從主要功能中洗掉了該功能，并從獨立的點擊功能中進行了錨點點擊，例如：
$(document).on('click', '.slider-button', function(){
slide();
});
如果有人有更好的方法來做我打算做的事情而無需額外的代碼行，請隨時分享。我希望有一天它會對某人有所幫助。干杯!
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/454967.html