面对此错误“ 未捕获的引用错误:幻灯片索引未定义 ”在光滑.js

facing this error " Uncaught ReferenceError: slideIndex is not defined " in slick.js

本文关键字：错误 未定义 索引 js 幻灯片 引用 面对      更新时间：2023-09-26

我用slick.js作为滑块功能。

我将代码编码为波纹管，但我面临此错误" Uncaught ReferenceError: slideIndex is not defined "。

<div class=" add-remove ">
   <h3>1</h3>
</div>
<div class="buttons">
   <a href="javascript:void(0)" class="button js-add-slide">Add Slide</a>
   <a href="javascript:void(0)" class="button js-remove-slide">Remove Slide</a>
</div>
<script>    
    $(document).ready(function(){
    $('.add-remove').slick({
      slidesToShow: 3,
      slidesToScroll: 3
    });
    $('.js-add-slide').on('click', function() {
      slideIndex++;
      $('.add-remove').slick('slickAdd','<div><h3>' + slideIndex + '</h3></div>');
    });
    $('.js-remove-slide').on('click', function() {
      $('.add-remove').slick('slickRemove',slideIndex - 1);
      if (slideIndex !== 0){
        slideIndex--;
      }
    });
    });
</script>

如果有人有解决此错误的想法，请帮助我。谢谢。

slideIndex是一个

变量。它没有定义。

在$(document).ready(function() {内声明slideIndex 

$(document).ready(function() {
  var slideIndex = 0; // Add this piece of code
  $('.add-remove').slick({
    slidesToShow: 3,
    slidesToScroll: 3
  });
  $('.js-add-slide').on('click', function() {
    slideIndex++;
    $('.add-remove').slick('slickAdd', '<div><h3>' + slideIndex + '</h3></div>');
  });
  $('.js-remove-slide').on('click', function() {
    $('.add-remove').slick('slickRemove', slideIndex - 1);
    if (slideIndex !== 0) {
      slideIndex--;
    }
  });
});
相关文章：