Question

我正在与一个在刷新时随机更改div的背景颜色的网站合作。我有一个有效的代码：

var bgcolorlist = ['#FFFFFF', '#000000', '#298ACC', '#B079E0'];

$(function() {
$('#color-change').css({
        background: bgcolorlist[Math.floor(Math.random()*bgcolorlist.length)]
        color: bgcolorlist[Math.floor(Math.random()*bgcolorlist.length)]
});
});

问题是我也尝试更改文本颜色以匹配当前的背景颜色。但是现在用我当前的代码，背景和文本颜色都随机改变。我该如何解决，只有div的背景颜色会随机变化，而文本颜色只会复制div的当前颜色？

Answer 1

您需要为文本颜色创建另一个列表，并用适当的颜色填充它。下面是带有示例颜色的列表：

var textColorList = ['#000000', '#ffffff', '#00ff00', '#ff0000'];
var bgcolorlist = ['#FFFFFF', '#000000', '#298ACC', '#B079E0'];

$(function() {
  var randomNumber = Math.floor(Math.random()*bgcolorlist.length)
  $('#color-change').css({         
    background: bgcolorlist[randomNumber]
    color: textColorList[randomNumber]
  });
});

Answer 2

var bgcolorlist = ['#FECE1B', '#F1585D', '#3BC2D6', '#A5CE39'];

$(function() {
  var backgroundColor = bgcolorlist[Math.floor(Math.random()*bgcolorlist.length)];
  $('#color-change').css({
        background: backgroundColor 
        color: backgroundColor 
  });
});

如何从css函数中提取随机颜色出场？

刷新时更改背景颜色和文本颜色

2 个答案: