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);

它提供[滑动，滑动]

所以这可能意味着你要获得一组滑动对象，[滑动，滑动] ......

除此之外

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

如果您要使用的唯一内容是[0]索引，则不需要执行每个语句，您可以执行$（'video'）[0] .pause（）或$（'video' ）.EQ（0）.pause（）;因为很少的事情会导致你的脚本在将来的代码中出错。

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

1 个答案: