Swiper - 方法不起作用 - mySwiper.slideTo 不是函数

Question

我正在使用 swiper 插件，但似乎无法使用任何方法。

我的 jQuery 和 swiper 是这样添加的：

<script src="jquery-3.2.1.min.js" type="text/javascript"></script>
<script src="swiper.jquery.js" type="text/javascript">

在我的 html 底部。我的 swiper 在文档就绪时像这样初始化：

mySwiper = new Swiper('.swiper-container', {
  direction: 'horizontal',
  nextButton: '.swiper-button-next',
  prevButton: '.swiper-button-prev',
  pagination: '.swiper-pagination',
  paginationType: 'fraction',
  grabCursor: true,
  keyboardControl: true,        
  onSlideChangeStart: function (){

    $('video').each(function() {  
        $(this)[0].pause();
    });

    $(".swiper-slide-active video").each(function() {  
        $(this)[0].play();
    });
        if ($(".swiper-slide-active").hasClass("layout4"))
        {
            video_visible = 1;
            $(".section").css("background-color", "black");
            $("body").css("color", "white");
            $(".swiper-button-prev").css("background-image", "url(img/leftArrowW.png)");
            $(".swiper-button-next").css("background-image", "url(img/rightArrowW.png)");
            $(".swiper-button-prev").css("opacity", "0.25");
            $(".swiper-button-next").css("opacity", "0.25");
            $(".headline").css("opacity", "0.25");
            $(".swiper-pagination").css("opacity", "0.25");
        }
        else {
            video_visible = 0;
            $(".section").css("background-color", "white");
            $("body").css("color", "black");
            $(".section .swiper-button-prev").css("background-image", "url(img/leftArrow.png)");
            $(".section .swiper-button-next").css("background-image", "url(img/rightArrow.png)");
            $(".swiper-button-prev").css("opacity", "1");
            $(".swiper-button-next").css("opacity", "1");
            $(".headline").css("opacity", "1");
            $(".swiper-pagination").css("opacity", "1");
        }
      if ($(".swiper-slide-active").hasClass("layout7"))
        {
            $(".layout7").css("background-color", "#e0e8eb");
        }

  },
  loop: true ,
});    

我想调用的函数是：

$('.section .down').waypoint(function(direction){
    if ($(".swiper-slide-active").hasClass("layout4")){
        if (direction == 'down') {
            if (!once_d){

                mySwiper.slideTo(1,100,false);

                $(".section").css("background-color", "white");
                $("body").css("color", "black");
                $(".swiper-button-prev").css("background-image", "url(img/leftArrow.png)");
                $(".swiper-button-next").css("background-image", "url(img/rightArrow.png)");
                $(".swiper-button-prev").css("opacity", "1");
                $(".swiper-button-next").css("opacity", "1");
                $(".headline").css("opacity", "1");
                $(".swiper-pagination").css("opacity", "1");
                $('video').each(function() {  
                $(this)[0].pause();
                });
                video_visible = 0;
                once_d = true;
            }
            else{
                return;
            }
        }
    }
}, { offset: "-25%" });

我得到的错误是：

Uncaught TypeError: mySwiper.slideTo is not a function
at Waypoint.$.waypoint.offset [as callback]

无论我尝试执行什么方法，都会发生这种情况。我试过

mySwiper.update();

还有。

我怀疑错误可能来自我的 swiper/jQuery 文件，但我也尝试重新下载。

提前致谢

Answer 1

如果之后

console.log(mySwiper);

它给 [Swipe,Swipe]

所以这可能意味着你得到了一系列滑动对象，[Swipe,Swipe]...

那一边

$('video').each(function() { $(this)[0].pause(); });

如果您要做的唯一事情是 [0] 索引，则不需要执行 each 语句，您可以这样做

$('video')[0].pause();

或者

$('video').eq(0).pause();

因为很少有事情会导致您的脚本在以后的代码中出错。