"Uncaught TypeError: Cannot read property 'stop' of undefined" on autoplay.stop() (Swiper)
"Uncaught TypeError: Cannot read property 'stop' of undefined" on autoplay.stop() (Swiper)
我已经在 Wordpress 设置中初始化了两个 Swiper 实例。他们自己的幻灯片按预期工作,但当我试图在悬停时停止其中一个幻灯片的自动播放时,我在控制台中得到 Uncaught TypeError: Cannot read property 'stop' of undefined
。
我的 Javascript 中的设置如下所示:
var newsSwiper = new Swiper ('.s2', {
// Optional parameters
direction: 'horizontal',
loop: true,
slidesPerView: 3,
spaceBetween: 20,
autoplay: {
delay: 5000,
},
});
var filmSwiper = new Swiper ('.s1', {
// Optional parameters
direction: 'horizontal',
loop: true,
slidesPerView: 'auto',
spaceBetween: 20,
// Navigation arrows
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
});
jQuery(".s2").hover(function() {
newsSwiper.autoplay.stop();
});
在阅读了 Swiper Github 上的一些 issues 之后,这似乎是正确的做法。但由于某种原因,该函数无法识别 newsSwiper
变量。有什么想法吗?
我很快就发现了问题。问题出在标记中,我不小心在两个幻灯片上使用了相同的 class (.s2
)。更改它以便只有一个幻灯片具有 class .s2
使错误消失。
我已经在 Wordpress 设置中初始化了两个 Swiper 实例。他们自己的幻灯片按预期工作,但当我试图在悬停时停止其中一个幻灯片的自动播放时,我在控制台中得到 Uncaught TypeError: Cannot read property 'stop' of undefined
。
我的 Javascript 中的设置如下所示:
var newsSwiper = new Swiper ('.s2', {
// Optional parameters
direction: 'horizontal',
loop: true,
slidesPerView: 3,
spaceBetween: 20,
autoplay: {
delay: 5000,
},
});
var filmSwiper = new Swiper ('.s1', {
// Optional parameters
direction: 'horizontal',
loop: true,
slidesPerView: 'auto',
spaceBetween: 20,
// Navigation arrows
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
});
jQuery(".s2").hover(function() {
newsSwiper.autoplay.stop();
});
在阅读了 Swiper Github 上的一些 issues 之后,这似乎是正确的做法。但由于某种原因,该函数无法识别 newsSwiper
变量。有什么想法吗?
我很快就发现了问题。问题出在标记中,我不小心在两个幻灯片上使用了相同的 class (.s2
)。更改它以便只有一个幻灯片具有 class .s2
使错误消失。