【问题标题】:I'm not sure how to reset the backgroundColor value我不确定如何重置 backgroundColor 值
【发布时间】:2018-01-05 01:52:25
【问题描述】:

现在我正在尝试开发一个非常简单的按钮来改变整个网页的背景颜色。这是我的代码

var mybutton = document.querySelector('button');
var myBack = document.querySelector("body");
var isRand = false;

var ranNumber1 = Math.floor(Math.random() * 256);
var ranNumber2 = Math.floor(Math.random() * 256);
var ranNumber3 = Math.floor(Math.random() * 256);
var RanRGB = "rgb(" + ranNumber1 + "," + ranNumber2 + "," + ranNumber3 + ")";


mybutton.addEventListener("click", function() {

  if (isRand) {
    myBack.style.backgroundColor = "white";
    isRand = false;
  } else {
    myBack.style.backgroundColor = RanRGB
    isRand = true;
  }
});
<!DOCTYPE html>
<html>
    <head>
        <title>toggle</title>
    </head>
    <body>
        <div>
            <button>click here!</button>
        </div>
        <script type="text/javascript" src="togglescript.js"></script>
    </body>
</html>

当此网页加载并单击按钮时,背景颜色会从白色变为随机颜色。然后,如果我再次单击它会再次变白。这就是我要的。但是,然后我希望能够再次单击该按钮并将颜色更改为新的随机颜色。目前它只是将其背景更改回它最初生成的颜色。如何重置背景颜色?

【问题讨论】:

    标签: javascript html random background


    【解决方案1】:

    将颜色生成移到您的函数中。

    var mybutton = document.querySelector('button');
    var myBack = document.querySelector("body");
    var isRand = false;
    
    mybutton.addEventListener("click", function() {
    
        var ranNumber1 = Math.floor(Math.random() * 256);
        var ranNumber2 = Math.floor(Math.random() * 256);
        var ranNumber3 = Math.floor(Math.random() * 256);
        var RanRGB = "rgb(" + ranNumber1 + "," + ranNumber2 + "," + ranNumber3 + ")";
    
      if (isRand) {
        myBack.style.backgroundColor = "white";
        isRand = false;
      } else {
        myBack.style.backgroundColor = RanRGB
        isRand = true;
      }
    });
    

    【讨论】:

    • 完美!谢谢我想到了,但由于某种原因我没有这样做。我会尽快接受你的回答
    猜你喜欢
    • 2010-10-05
    • 2023-01-26
    • 1970-01-01
    • 2015-03-09
    • 2019-09-16
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多