javascript - 危险的滑动器，需要取消滑动到下一张幻灯片

Question

我有问题。我需要验证幻灯片中的某些内容，如果无效，请不要更改幻灯片。这是代码，但无法正常工作。

var calcSwiper = $('.calculator .swiper-container').swiper({
    nextButton: '.swiper-button-next',
    prevButton: '.swiper-button-prev',

    onSlideNextStart: function (sw) {
        var input = $(sw.slides[sw.activeIndex-1]).find('input');
        if(input.length&&!input.valid()){
          //here it will stop
          return false;

        }
    }
});

Answer 1

我不得不处理一个类似的问题，我需要控制是否可以滑动到下一张或上一张幻灯片。

这是我的解决方案:

var myswiper = new Swiper('.swiper-container', {
    /** some options **/
    onClick: function(swiper, event){
        var source = event.target || event.srcElement;
        var isNext = $(source).hasClass('swiper-button-next');
        var isPrev = $(source).hasClass('swiper-button-prev');
        // check if the event's source are the navigation arrows
        if (isNext || isPrev) {
            if (/*[YOUR CONDITION]*/) {
                swiper.unlockSwipes();
                if (isNext) {swiper.slideNext();}
                else if (isPrev) {swiper.slidePrev();}
                swiper.lockSwipes();
            }
        }
    }
});
myswiper.lockSwipes(); 

它可能看起来有点丑，但它确实有效。欢迎任何改进。

希望对您有所帮助。谢谢