如何仅在页面加载完成后以及调用另一个函数之后才调用函数

Question

所以我正在使用http://kenwheeler.github.io/slick/和http://instafeedjs.com/，并且我正在尝试根据instagram feed制作轮播滑块，我遇到的问题是由于#instafeed的内容是动态加载的，因此它一直返回未定义的javascript代码，因为尚未将其注入dom。 在调用函数userFeed.run()并注入instagram照片后，如何加载代码？

$(window).bind("load", function() {             
    var userFeed = new Instafeed({
        get: 'user',
        userId: 434846375,
        accessToken: '#############################',
        limit: 5,
        template: '<div style="display: inline-block;"><img src="{{image}}" /></div>'
    });
   // userFeed.run();
    $.when(userFeed.run()).done(function()
    {

            $('.your-class').slick({
                arrows:true
            });
            var array = $( "#instafeed" ).toArray();
            for(i = 0; i < 5; ++i)
            {
            alert(array[i]);
            //$('.your-class').slickAdd(array[i]);
            }   
    });
});

Answer 1

不幸的是，似乎userFeed.run()会立即返回true，并且您需要它来返回Deferred / Promise以便与$.when 。

但是，您可以向Instafeed初始化添加after回调，该回调应执行您想要的操作：

var userFeed = new Instafeed({
    get: 'user',
    userId: 434846375,
    accessToken: '#############################',
    limit: 5,
    template: '<div style="display: inline-block;"><img src="{{image}}" /></div>',
    after: function() {
       // Images added to DOM, do stuff here
    }
});