Javascript 未将项添加到数组中？

所以这应该非常简单，但我不知道出了什么问题

    var imageColors = [];

    $('.portfolio-image').each(function(index, el) {
        RGBaster.colors(this, {
          success: function(payload) {
            console.log(payload.dominant);
            imageColors.push(payload.dominant);
          }
        });
    });

    $('.portfolio-title').each(function(index, el) {
        $(this).css('color', 'imageColors[index]');
    });

});

因此，上面的代码有一个数组，它应该存储来自一组图像的颜色。然后，我们循环浏览一些文本，并将文本颜色设置为每个图像的主色，按它们可见的顺序排列

---

无论如何，问题是无论我如何“添加”ImageColor数组中的内容，其中都没有任何内容。当我运行数组长度的console.log时，它总是0。有人能解释为什么没有添加任何内容吗？

去掉字符串值

$.each(imageColors, function(index, el) {
    $('.portfolio-title').css('color', imageColors[index]);
});

---

错误

'imageColors[index]

更正

imageColors[index]

您必须执行此操作

$('.portfolio-title').each(function(index, el) {
    $(this).css('color', imageColors[index]); \\ remove single quote
});

---

由于有一个

success

回调传递给

colors

插件，因此它看起来像是一个异步方法，这意味着当执行第二个块时，数组可能没有填充所需的数据

这里的一个解决方案是在回调函数中设置颜色css，如

var imageColors = [];
var $titles = $('.portfolio-title');
$('.portfolio-image').each(function (index, el) {
    RGBaster.colors(this, {
        success: function (payload) {
            imageColors.push(payload.dominant);
            $titles.eq(index).css('color', payload.dominant);
        }
    });
});

---

请制作工作小提琴，并让我们知道它的变化，但没有颜色的变化。例如，payload.dominate的输出是rgb（0,0,0），所以它应该在那里工作，对吗？而且长度仍然表示为零。如果在尝试更改日志中文本的颜色之前运行console.log（imageColors.length），它仍然会记录0。问题是没有向数组中添加任何内容。这与颜色的设置无关。这是可行的，一定是异步问题。谢谢你的帮助！