myswiper.slideTo（）不是一个函数

Question

我在控制台中有这个错误，但我不明白为什么

var mySwiper = new Swiper('.swiper-container', {
    speed: 400,
    loop: true,
    slidesPerView:1,
    calculateHeight: true,
    spaceBetween: 50,
    watchActiveIndex: true,
    prevButton: '.swiper-button-prev',
    nextButton: '.swiper-button-next'
});

  $('input[type=radio][name=radio]').change(function() {
    var indx = $(this).val();
    mySwiper.slideTo(indx,400,false);
});

screen shot of error

Answer 1

mySwiper未在您的更改功能中定义。

我想如果你在更改函数中检查mySwiper的值，它将为null，因为它没有在你的函数中设置。

Answer 2

可能你有一个以上的swiper元素 - 然后使用数组来调用slideTo：

mySwiper[0].slideTo(1);

Answer 3

你的代码似乎是对的。

您的问题肯定是链接到脚本的负载。

检查您是否正确加载JQuery

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

和

<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.4.0/js/swiper.min.js"></script>

Answer 4

你需要制作“mySwiper”golabl，这样你就可以在其他函数中调用它来声明一个全局变量，你必须删除“var”并开始输入变量的名字，如下所示：

mySwiper = new Swiper('.swiper-container', {
    speed: 400,
    loop: true,
    slidesPerView:1,
    calculateHeight: true,
    spaceBetween: 50,
    watchActiveIndex: true,
    prevButton: '.swiper-button-prev',
    nextButton: '.swiper-button-next'
});

然后你可以随时调用它

Answer 5

你应该像这样更改swiper的className：

mySwiper = new Swiper('.swiper-box', {
    speed: 400,
    loop: true,
    slidesPerView:1,
    calculateHeight: true,
    spaceBetween: 50,
    watchActiveIndex: true,
    prevButton: '.swiper-button-prev',
    nextButton: '.swiper-button-next'
});