Question

我成功地每4秒生成0到180次循环的随机数。

我需要根据随机数设置div的背景颜色。像

在0到60之间将css颜色设置为红色，rgba（255,0,0,1.0）

介于61和120绿色之间，rgba（0,255,0,1.0）

介于121和180蓝色之间，rgba（0,0,255,1.0）

所以这一切都取决于变量......任何想法......

Answer 1

运行此代码并单击框以获取随机颜色

＆＃13;

    $(window).ready(function() {

  $('#background').click(function() {

    var number = Math.floor((Math.random() * 180) + 0);
   console.log("random number is: "+ number);
    if (number <= 60) {
      $(this).css('backgroundColor', "rgba(255, 0, 0, 1.0)")

    } else if (number <= 120) {
      $(this).css('backgroundColor', 'rgba(0, 255, 0, 1.0)');
    } else {
      $(this).css('backgroundColor', 'rgba(0, 0, 255, 1.0)');
    }

  });
})

＆＃13;

#background {
  width: 100px;
  height: 100px;
  background-color: rgb(255, 0, 255);
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<div id="background"></div>

＆＃13;

Answer 2

首先，通常最好将您的代码包含在您的S.O问题中，以便为您的问题提供一些背景信息。

话虽如此，以下内容可以帮助您：

var ran // your random number
if (ran < 60) {
  $("div selector").css("color", "your color value here");
} else if (ran < 120) {
  $("div selector").css("color", "your color value here");
}

等等。

Answer 3

if (number <= 60) {
  $('#my-div').css('background-color', 'rgba(255, 0, 0, 1.0)');
} else if (number <= 120) {
  $('#my-div').css('background-color', 'rgba(0, 255, 0, 1.0)');
} else {
  $('#my-div').css('background-color', 'rgba(0, 0, 255, 1.0)');
}

......但是，这是一个答案吗？我想，我没有很好地回答你的问题。

根据范围设置css颜色

3 个答案: