我将如何阻止随机颜色随机选择两次相同的颜色[重复]
Posted
技术标签:
【中文标题】我将如何阻止随机颜色随机选择两次相同的颜色[重复]【英文标题】：How would I stop an random colour randomise from picking the same colour twice [duplicate] 【发布时间】：2022-01-16 18:50:21 【问题描述】：<script>
function randomColour()
var colour=[];
colour[0]= '#edf2fb';
colour[1]= '#d7e3fc';
colour[3]= '#c1d3fe';
colour[4]= '#d1d1d1';
colour[5]= '#e1dbd6';
colour[6]= '#e2e2e2';
colour[7]= '#f9f6f2';
colour[8]='#ffc09f';
colour[9]='#ffee93';
colour[10]='#fcf5c7';
colour[11]='#a0ced9';
colour[12]='#adf7b6';
colour[13]='#809bce';
colour[14]='#95b8d1';
colour[15]='#b8e0d2';
colour[16]='#d6eadf';
colour[17]='#eac4d5';
colour[18]='#e8d1c5';
colour[19]='#eddcd2';
colour[20]='#fff1e6';
colour[21]='#f0efeb';
colour[22]='#eeddd3';
colour[23]='#e8dff5';
colour[24]='#fce1e4';
colour[25]='#fcf4dd';
colour[26]='#ddedea';
colour[27]='#daeaf6';
colour[28]='#d3ab9e';
colour[29]='#eac9c1';
colour[30]='#ebd8d0';
colour[31]='#ffe5ec';
colour[32]='#ffc2d1';
colour[33]='#ceb5b7';
colour[35]='#b5d6d6';
colour[36]='#f2f5ff';
colour[37]='#efcfe3';
colour[38]='#eaf2d7';
colour[39]='#b3dee2';
colour[40]='#f8ad9d';
colour[41]='#fbc4ab';
colour[42]='#ffdab9';
colour[43]='#cdb4db';
colour[44]='#ffc8dd';
colour[45]='#ffafcc';
colour[46]='#bde0fe';
colour[47]='#a2d2ff';
colour[48]='#fdffb6';
colour[49]='#caffbf';
colour[50]='#9bf6ff';
colour[51]='#a0c4ff';
colour[52]='#ffc6ff';
colour[53]='#a7bed3';
colour[54]='#c6e2e9';
colour[55]='#f1ffc4';
colour[56]='#ffcaaf';
colour[57]='#dab894';
colour[58]='#fec7bc';
colour[59]='#fcf5ee';
var pick= Math.floor(Math.random()*60);
var test = document.getElementById("colorpad");
test.style.backgroundColor = colour[pick];
return colour[pick];
</script>
我想知道我如何能够阻止这个随机颜色选择器两次选择相同的颜色，因为当我希望它选择另一种随机颜色时它正在这样做。我不知道为什么会发生这种情况，我应该在我的代码中实现什么来阻止这种情况发生。
【问题讨论】：
这能回答你的问题吗？ How can I remove a specific item from an array? 作为提示，要每次获取新颜色，您需要将当前背景颜色与新颜色进行比较。如果它们相同，则需要重新选择。但是您需要考虑一个事实，即根据定义，随机可能导致您选择相同的颜色，10、20、20000 或 10e15 次。这对你来说是随机的！ @Kailau05 您能否澄清一下您是否只想防止同一颜色被连续选择两次，还是在程序期间？例如，red-blue-red-blue-red 是有效的输出吗？ @MattDunn 我只想防止相同的颜色被选中两次，例如红色，红色我不希望这种情况发生。 如果您找到了有效的答案，请将其标记为正确的。 【参考方案1】：您必须维护另一个列表，我们称之为：“already_picked”。如果您选择带有“pick”编号的颜色，则必须将该编号放入此“already_picked”列表中。在选择另一种颜色之前，您必须检查所选数字当前是否在此列表中，如果是，请选择其他颜色。
【讨论】：
这仅在期望的行为是防止在程序期间两次选择相同的颜色时才有效。我的假设是 OP 只是希望连续两次选择相同的颜色。【参考方案2】：<html>
<head>
<script>
var usedColors = [];
function randomColour()
var colour=[];
colour[0]= '#edf2fb';
colour[1]= '#d7e3fc';
colour[3]= '#c1d3fe';
colour[4]= '#d1d1d1';
colour[5]= '#e1dbd6';
colour[6]= '#e2e2e2';
colour[7]= '#f9f6f2';
colour[8]='#ffc09f';
colour[9]='#ffee93';
colour[10]='#fcf5c7';
colour[11]='#a0ced9';
colour[12]='#adf7b6';
colour[13]='#809bce';
colour[14]='#95b8d1';
colour[15]='#b8e0d2';
colour[16]='#d6eadf';
colour[17]='#eac4d5';
colour[18]='#e8d1c5';
colour[19]='#eddcd2';
colour[20]='#fff1e6';
colour[21]='#f0efeb';
colour[22]='#eeddd3';
colour[23]='#e8dff5';
colour[24]='#fce1e4';
colour[25]='#fcf4dd';
colour[26]='#ddedea';
colour[27]='#daeaf6';
colour[28]='#d3ab9e';
colour[29]='#eac9c1';
colour[30]='#ebd8d0';
colour[31]='#ffe5ec';
colour[32]='#ffc2d1';
colour[33]='#ceb5b7';
colour[35]='#b5d6d6';
colour[36]='#f2f5ff';
colour[37]='#efcfe3';
colour[38]='#eaf2d7';
colour[39]='#b3dee2';
colour[40]='#f8ad9d';
colour[41]='#fbc4ab';
colour[42]='#ffdab9';
colour[43]='#cdb4db';
colour[44]='#ffc8dd';
colour[45]='#ffafcc';
colour[46]='#bde0fe';
colour[47]='#a2d2ff';
colour[48]='#fdffb6';
colour[49]='#caffbf';
colour[50]='#9bf6ff';
colour[51]='#a0c4ff';
colour[52]='#ffc6ff';
colour[53]='#a7bed3';
colour[54]='#c6e2e9';
colour[55]='#f1ffc4';
colour[56]='#ffcaaf';
colour[57]='#dab894';
colour[58]='#fec7bc';
colour[59]='#fcf5ee';
var pick= Math.floor(Math.random()*60);
if(usedColors.includes(pick))
randomColour();
usedColors.push(pick);
document.getElementById("colorpad").style.backgroundColor = colour[pick];
console.log(usedColors);
</script>
</head>
<body>
<div id="colorpad" style="height: 300px; width: 300px;">
<button onclick="randomColour()">btn</button>
</div>
</body>
</html>您需要添加一个变量来记住使用的颜色。我使用array 这样做。
【讨论】：
这将如何在 A 框中而不是全屏中实现。我用 在我的coden-p中改变了它 感谢您的帮助，当我单击随机按钮 60 次时，没有任何颜色显示。然后我将如何重新启动该过程？ 您可以通过像这样清除数组usedColors = [] 来重新启动它。
如果数组已经清空了怎么办？我需要实现一个可以重复该过程的循环吗？
【参考方案3】：
var colour = [];
colour[0] = '#edf2fb';
colour[1] = '#d7e3fc';
colour[2] = '#d7e3f3';
colour[3] = '#c1d3fe';
colour[4] = '#d1d1d1';
colour[5] = '#e1dbd6';
colour[6] = '#e2e2e2';
colour[7] = '#f9f6f2';
colour[8] = '#ffc09f';
colour[9] = '#ffee93';
colour[10] = '#fcf5c7';
colour[11] = '#a0ced9';
colour[12] = '#adf7b6';
colour[13] = '#809bce';
colour[14] = '#95b8d1';
colour[15] = '#b8e0d2';
colour[16] = '#d6eadf';
colour[17] = '#eac4d5';
colour[18] = '#e8d1c5';
colour[19] = '#eddcd2';
colour[20] = '#fff1e6';
colour[21] = '#f0efeb';
colour[22] = '#eeddd3';
colour[23] = '#e8dff5';
colour[24] = '#fce1e4';
colour[25] = '#fcf4dd';
colour[26] = '#ddedea';
colour[27] = '#daeaf6';
colour[28] = '#d3ab9e';
colour[29] = '#eac9c1';
colour[30] = '#ebd8d0';
colour[31] = '#ffe5ec';
colour[32] = '#ffc2d1';
colour[33] = '#ceb5b7';
colour[34] = '#ceb5b8';
colour[35] = '#b5d6d6';
colour[36] = '#f2f5ff';
colour[37] = '#efcfe3';
colour[38] = '#eaf2d7';
colour[39] = '#b3dee2';
colour[40] = '#f8ad9d';
colour[41] = '#fbc4ab';
colour[42] = '#ffdab9';
colour[43] = '#cdb4db';
colour[44] = '#ffc8dd';
colour[45] = '#ffafcc';
colour[46] = '#bde0fe';
colour[47] = '#a2d2ff';
colour[48] = '#fdffb6';
colour[49] = '#caffbf';
colour[50] = '#9bf6ff';
colour[51] = '#a0c4ff';
colour[52] = '#ffc6ff';
colour[53] = '#a7bed3';
colour[54] = '#c6e2e9';
colour[55] = '#f1ffc4';
colour[56] = '#ffcaaf';
colour[57] = '#dab894';
colour[58] = '#fec7bc';
colour[59] = '#fcf5ee';
function randomColour()
if(colour.length > 0)
// Get random based on current size of the array
var pick = Math.floor(Math.random() * colour.length);
var pickedColour = colour[pick];
// remove the colour which was picked.
colour.splice(pick, 1);
return pickedColour;
else
// Handle error here or reset the array to original
console.log("No color");
return "#FFFFFF"
// To test
for ( let i = 0; i < colour.length; i++)
console.log(randomColour());
【讨论】：
以上是关于我将如何阻止随机颜色随机选择两次相同的颜色[重复]的主要内容，如果未能解决你的问题，请参考以下文章