myswiper.slideTo() 不是函数

myswiper.slideTo() is not a function

我在控制台中遇到此错误,但我不明白为什么

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

mySwiper 未在您的更改函数中定义。

我想如果您在更改函数中检查 mySwiper 的值,它将为 null,因为它尚未在您的函数中设置。

您的代码似乎是正确的。

你的问题肯定是link脚本的加载问题

检查您是否正确加载 JQuery

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

AND

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

您需要制作 "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'
});

然后你可以在任何你需要的地方调用它

您应该像这样更改 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'
});

可能你有不止一个swiper元素——然后使用数组调用slideTo:

mySwiper[0].slideTo(1);

试试这个代码:

mySwiper[mySwiper.length - 1].slideTo(0, 1000);