javascript - Slick Carousel unable to call Methods - Stack Overflow

admin管理员组

文章数量:1393380

I have several instances of the Slick Carousel gallery set up and working properly. However, I cannot successfully call the Methods as described in the documentation. (/)

Whenever I try to target an existing instance of the carousel, I get the following error: "Uncaught TypeError: Cannot read property 'changeSlide' of undefined." I'm trying to automatically goto the next slide after the gallery is initiated.

I've put together this jsfiddle to replicate the issue: /

var gallery = $('.slick-container');
    gallery.slick({
        speed:100,
        dots:true,
        onInit: function(){
            gallery.slickNext();
        }
    });

Error:

Uncaught TypeError: Cannot read property 'changeSlide' of undefined 

Targeting this, $(this), $('.slick-container'), and gallery all produce the same exception. Any help is greatly appreciated, thank you!!

EDIT

Thanks to Sunand for the fix! For those dealing with the same issue, simply move your method out of the onInit callback. Apparently the slick instance is not fully initialized when onInit is called. Here's the correct code:

var gallery = $('.slick-container');
    gallery.slick({
        speed:100,
        dots:true,
    });

gallery.slickNext();

I have several instances of the Slick Carousel gallery set up and working properly. However, I cannot successfully call the Methods as described in the documentation. (http://kenwheeler.github.io/slick/)

Whenever I try to target an existing instance of the carousel, I get the following error: "Uncaught TypeError: Cannot read property 'changeSlide' of undefined." I'm trying to automatically goto the next slide after the gallery is initiated.

I've put together this jsfiddle to replicate the issue: http://jsfiddle/d32x7nqp/

var gallery = $('.slick-container');
    gallery.slick({
        speed:100,
        dots:true,
        onInit: function(){
            gallery.slickNext();
        }
    });

Error:

Uncaught TypeError: Cannot read property 'changeSlide' of undefined 

Targeting this, $(this), $('.slick-container'), and gallery all produce the same exception. Any help is greatly appreciated, thank you!!

EDIT

Thanks to Sunand for the fix! For those dealing with the same issue, simply move your method out of the onInit callback. Apparently the slick instance is not fully initialized when onInit is called. Here's the correct code:

var gallery = $('.slick-container');
    gallery.slick({
        speed:100,
        dots:true,
    });

gallery.slickNext();

• javascript
• jquery
• carousel

Share Improve this question Follow edited Sep 23, 2014 at 22:17 ixninja asked Sep 22, 2014 at 19:53 ixninjaixninja 74666 silver badges1717 bronze badges 3

• can you tell how are you calling the methods? – Sunand Commented Sep 22, 2014 at 20:41
• Sunand, please see the jsfiddle that I included in my post. – ixninja Commented Sep 23, 2014 at 14:18
• 1 the error is because that ponent is not pletely initialised when onInit is called. If just want to call next after initialisation call it after you call the slick plugin. – Sunand Commented Sep 23, 2014 at 18:31

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

I'm noticing after upgrading my slick.js a lot of the methods like slickPrev() etc are gone. Looks like the way to call them now seems to be

$('selector').slick('slickPrev');

本文标签： javascriptSlick Carousel unable to call MethodsStack Overflow