我可以使用if语句更改Swiper javascript滑块的API选项吗?

时间:2019-01-20 23:54:06

标签: javascript swiper

抱歉,这是一个愚蠢的问题。我正在使用iDangerous开发的Swiper javascript滑块。它带有HTML文件中的一个初始化字段,其中是滑块的初始化选项。

我处于一种需要在网页上搜索称为#editor-content的特定元素的情况。如果找到该元素,则需要将Swiper初始化的simulateTouch选项设置为false.。如果找不到该元素,则应将stimulateTouch选项设置为{{1} }

我正在使用jQuery完成查找元素。我正在使用true.完成此操作。这部分工作正常。

这是Swiper初始化的样子...

if(($('#editor-content').length)){...}

到目前为止,我已经尝试根据结果不同地初始化滑块。如果找到该元素,请在禁用选项的情况下初始化刷卡器。如果不是,请在启用该选项的情况下初始化swiper。那是行不通的(请参见下面的代码,对于缩进,我感到非常抱歉):

<script>
swiper = new Swiper('.swiper-container', {
spaceBetween: 30,
centeredSlides: true,

// This is the option that needs to be set to true/false depending on whether the #editor-content element exists in the webpage or not...
stimulateTouch = false;***

autoplay: {
delay: 2500,
disableOnInteraction: true,
},
pagination: {
el: '.swiper-pagination',
clickable: true,
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
});
</script>

我希望滑块在#editor-content确实存在时将<script> var swiper = undefined; function initSwiper() { // If the jQuery detects an #editor-content element (meaning you're in the editor...) if((jQuery('#editor-content').length)){ swiper = new Swiper('.swiper-container', { spaceBetween: 30, centeredSlides: true, // Element found, so initialize the slider with option below set to false simulateTouch = false, autoplay: { delay: 2500, disableOnInteraction: true, }, pagination: { el: '.swiper-pagination', clickable: true, }, navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev', }, }); } else { var swiper2 = new Swiper('.swiper-container', { spaceBetween: 30, centeredSlides: true, // Element not found, so initialize the slider with option below set to true simulateTouch = true, autoplay: { delay: 2500, disableOnInteraction: true, }, pagination: { el: '.swiper-pagination', clickable: true, }, navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev', }, }); } } // Initialize the function initSwiper(); </script> 选项设置为false,而在正文中的元素不存在时将其设置为true。但是到目前为止,我尝试的代码只是使整个滑块js无法起作用。帮助吗?

1 个答案:

答案 0 :(得分:0)

如果通过JavaScript验证程序(例如:http://esprima.org/demo/validate.html)运行代码,则会在第12行发现语法错误。

stimulateTouch = false,

需要成为

stimulateTouch: false,

和其他属性一样。

仅供参考,您可能想研究使用Chrome开发者工具或其他调试工具来解决此类小问题。控制台将通知您是否有语法错误,并且您可以使用调试器设置断点并逐行浏览代码,以便找到开始呈梨形的确切位置。