Question

所以我在同一页面上有很多同一个类的div。我想在我自己的选择中添加不同的背景（有5-6个随机背景）

我在互联网上找到了这段代码。但它为所有div选择相同的随机颜色。

 <script type="text/javascript">

/***********************************************
* Random Content Colors script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

//specify list of random background colors to apply to CSS class "randomcolor"
//For each entry, you can optionally specify a text and link color via the syntax:
// "BackgroundColor:TextColor" OR "BackgroundColor:TextColor:LinkColor"
var randombgcolors=["green:white:yellow", "#DDF4FF", "#FFFF97", "#CFFF9F"]

var rbcssrule=""
var randomnum=Math.floor(Math.random()*randombgcolors.length)
if (randombgcolors[randomnum].indexOf(":")!=-1){
rbcssrule="background-color: "+randombgcolors[randomnum].split(":")[0]+";"
rbcssrule+="color: "+randombgcolors[randomnum].split(":")[1]+";"
}
else
rbcssrule="background-color: "+randombgcolors[randomnum]+";"

document.write('<style type="text/css">\n')
document.write('.randomcolor{'+rbcssrule+'}\n')
if (randombgcolors[randomnum].split(":").length==3) //if link color specified
document.write('.randomcolor a{color:'+randombgcolors[randomnum].split(":")[2]+';}\n')
document.write('<\/style>')

</script>

Answer 1

看起来代码将其随机选择的颜色设置为一个类：randomcolor。假设你的所有div都有相同的类，它们都将获得随机颜色。

编辑：

检查我制作的这个JSFiddle，它应该能满足您的需求：

http://jsfiddle.net/VXG36/1/

HTML：

<div class="random">Div 1</div>
<div class="random">Div 2</div>
<div class="random">Div 3</div>

JQuery的：

$(document).ready(function() {
    var randomColors = ["green","yellow","red","blue","orange","pink","cyan"];
    $(".random").each(function(index) {
        var len = randomColors.length;
        var randomNum = Math.floor(Math.random()*len);
        $(this).css("backgroundColor",randomColors[randomNum]);
        //Removes color from array so it can't be used again
        randomColors.splice(randomNum, 1);
    });
});

Answer 2

我的理解是你的 randomnum 永远是4.当它击中你的“green：white：yellow”集合时，它总会分成randombgcolors [randomnum] .split（“：”）[ 0]是绿色的，而randombgcolors [randomnum] .split（“：”）[1]总是白色的。也许当你点击 randomnum 时，你需要一个随机发生器来在0和2之间选择以获得随机绿色：白色：黄色。

许多具有相同类别的div - 不同的背景

2 个答案: