实际上,我正在使用香草javascript设计自动播放滑块。因此有两个功能,一个是播放前进滑块,而另一个是倒退。当我在前向滑块中的最后一项上时,我想清除间隔并启动反向滑块,反之亦然,当我在后向滑块中的最后一项上时,我想清除间隔并启动前向滑块。但是间隔不会被清除,一旦切换到反向滑块并继续运行两个间隔
function sliderForwardAutoplay(){
var Fid = setInterval(()=>{
var currentSlider = document.querySelector('.current-slider');
if(parseInt(currentSlider.dataset.num)===2){
clearInterval(Fid);
sliderReverseAutoplay();
}
// alert(currentSlider.dataset.num+1);
// currentSlider.classList.add('swipe-left');
getSliderLayer(parseInt(currentSlider.dataset.num)+1).classList.add('swipe','current-slider');
setInterval(()=>{
getImgLayer(parseInt(currentSlider.dataset.num)+1).classList.add('left-0');
},500);
currentSlider.classList.remove('current-slider');
},5000);
}
function sliderReverseAutoplay(){
var Rid = setInterval(()=>{
var currentSlider = document.querySelector('.current-slider');
if(parseInt(currentSlider.dataset.num)===0){
clearInterval(Rid);
sliderForwardAutoplay();
}
// alert(currentSlider.dataset.num+1);
// currentSlider.classList.add('swipe-left');
getSliderLayer(parseInt(currentSlider.dataset.num)).classList.add('swipe-right');
getSliderLayer(parseInt(currentSlider.dataset.num)-1).classList.add('current-slider'); currentSlider.classList.remove('current-slider');
},5000);
}