在slick.js中遇到此错误“Uncaught ReferenceError:slideIndex未定义”

时间:2016-03-08 13:24:10

标签: javascript jquery ruby-on-rails slick.js

我使用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>
如果有人想知道解决此错误,请帮助我。 三江源。

1 个答案:

答案 0 :(得分:1)

slideIndex是一个变量。它没有定义。

slideIndex

中声明$(document).ready(function() {
$(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--;
    }
  });

});