Javascript 在RequireJS文件之间传递函数

我有一个文件需要在page load randomise_colors.js上运行，但也需要由另一个文件调用，作为infinite_scroll.js中回调函数的一部分。randomise_colors脚本只是在页面上的帖子列表中循环，并从前端使用的数组中为每个帖子分配一种颜色

Infinite Scroll通过单击按钮将新帖子加载到DOM中，但由于页面加载时已经运行了randomise_colors.js文件，因此加载的新内容不受此影响，因此我需要再次运行它。我愿意接受其他建议，如果听起来我可以用不同的方式解决这个问题，我不是JS专家

目前我得到了未捕获的引用错误：参考这行infinite_scroll.js，未定义随机颜色：

randomise_colours.init();

我正在调用所有需要加载到app.js中document.ready的文件

这是infinite_scroll.js，它初始化infinite scroll并具有回调功能。无论何时，只要使用AJAX加载新项，回调函数就会运行。我已经在需要运行randomise_colors.js中的randomise_colors.init函数的区域周围放置了asterix

define(['infinitescroll'], function() {

    var $ = jQuery,
        $loadMore = $('.load-more-posts a');

        function addClasses() {
            **randomise_colours.init();**
        };

    return {

        init: function() {
            if($loadMore.length >= 1) {
                this.setUp();
            } else {
                return false;
            }
        },

        setUp: function() {
            this.initInfiniteScroll();
        },

        initInfiniteScroll: function() {
            $('.article-listing').infinitescroll({
                navSelector  : '.load-more-posts',            
                nextSelector : '.load-more-posts a',    
                itemSelector : '.standard-post'          
            }, function(newItems) {
                addClasses();
            });

            //Unbind the standard scroll-load function
            $(window).unbind('.infscr');

            //Click handler to retrieve new posts
            $loadMore.on('click', function() {
                $('.article-listing').infinitescroll('retrieve');
                return false;
            });
        }

    };

});

这是我的randomise_colors.js文件，它在加载时运行良好，但在加载新内容后需要重新调用

define([], function() {

    var $ = jQuery,
        $colouredSlide = $('.image-overlay'),

        colours = ['#e4cba3', '#867d75', '#e1ecb9', '#f5f08a'],
        used = [];

        function pickRandomColour() {

            if(colours.length == 0) {
                colours.push.apply(colours, used);
                used = [];
            }
            var selected = colours[Math.floor(Math.random() * colours.length)]; 
            var getSelectedIndex = colours.indexOf(selected);
            colours.splice(getSelectedIndex, 1);
            used.push(selected);

            return selected;
        };

    return {

        init: function() {
            if($colouredSlide.length >= 1) {
                this.setUp();
            } else {
                return false;
            }
        },

        setUp: function() {
            this.randomiseColours();
        },

        randomiseColours: function() {
            console.log('randomise');
            $colouredSlide.each(function() {
                var newColour = pickRandomColour();
                $(this).css('background', newColour);
            });
        }

    };

});

---

您必须在infiniteScroll文件中引用RandomiseColor。因此，您需要将定义函数更改为以下内容：

define(['infinitescroll', 'randomise-colours'], function(infiniteScroll, randomise_colours)

---

请记住，在使用require时，您需要通过define函数引用所有变量，否则它们将无法识别。

非常感谢，这很有效。不幸的是，randomise_colors函数似乎没有在新添加的内容上起作用，但我想这是一个单独的问题。

define(['infinitescroll', 'randomise-colours'], function(infiniteScroll, randomise_colours)