Question

我有6个正方形，我想为它们分配6种已经定义的颜色，但是是随机的。因此，对于1个正方形，应该有1种颜色，并且每次我单击“再次播放”时，它们都应该随机混合。到目前为止，我设法使所有正方形都使用六种颜色中的一种，但是由于它们是随机选择的，所以我经常会遇到例如3种灰色但0种红色的情况。我不确定如何更好地解释这一点，因此，如果您有任何问题，我会很乐意回答。

HTML：

<div id="container">
    <div class="square"></div>
    <div class="square"></div>
    <div class="square"></div>
    <div class="square"></div>
    <div class="square"></div>
    <div class="square"></div>
</div>

JS：

var squares = $(".square");
var colors = {
    'yellow': 'rgb(255, 255, 0)',    
    'orange': 'rgb(255, 153, 0)',
    'green': 'rgb(0, 255, 0)',
    'blue': 'rgb(0, 0, 255)',
    'gray': 'rgb(128, 128, 128)',
    'purple': 'rgb(153, 0, 255)'
};

for(var i=0; i < squares.length; i++) {
    squares[i].style.backgroundColor = randomColors();
    squares[i].style.display = "block";
}

function randomColors(ranCol) { 
    var ranCol = Object.keys(colors)[Math.floor(Math.random()*Object.keys(colors).length)];
    return ranCol;
}

Answer 1

您可以algorithm from Wikipedia，然后从改组的结果中分配它们：

name:"rajesh";//1st row
id:100009;
branch:"angular";


name:"sai";//2nd row
id:1004;
branch:"angular";  like this

如果您不想走那条路线，可以将它们放在一个数组中并从中随机选择颜色，并删除每次选择的颜色：

var array = Object.keys(colors);
shuffleArray(array);
for(var i=0; i < squares.length; i++){
    squares[i].style.backgroundColor = colors[array[i]];
    squares[i].style.display = "block";
}

如何为对象随机分配特定的颜色？

1 个答案: