无法创建 "if then" Javascript 语句来更改页面的背景颜色

Question

我现在正在做一个项目，它要求我们使用 RNG 中内置的 Javascripts 生成一个 0-37 的数字，然后如果数字是奇数，则将背景颜色从蓝色更改为黑色，如果数字为奇数，则将蓝色更改为如果数字是偶数，则为红色。我几乎可以肯定我的命令是正确的，但我仍然无法弄清楚我做错了什么。只是寻找另一双眼睛来扫视一下，可能会发现我做错了什么。

这是我目前使用的代码： ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~~~~~~~~~

<!DOCTYPE html>
<html>

<script type="text/javascript">

function changeColor () {
    if ( ('wheel' % 2) == 0) {
    document.body.style.backgroundColor = "red";
    }
    else {
    document.body.style.backgroundColor = "black";
}
}

</script>

<body bgcolor="blue">



<p><font size="4" color="white"><b>First place a bet on a number or color. 
<br>Then, spin the wheel to see if you win.</b></font></p>

<button onclick="myFunction()">Spin the Wheel</button>

<font face="Jokerman" color="white" size="6"><p id="wheel"></p></font>

<script>
function myFunction() {
    var x = Math.floor((Math.random() * 38) + 0);
    document.getElementById("wheel").innerHTML = x;
}
</script>

</body>
</html>

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~

页面正确加载，生成数字的按钮工作正常，但无论结果如何，背景颜色仍然是蓝色。

Answer 1

不，你的 "commands" 不对。

在这里，你尝试从一个简单的 JS 字符串中获取模：
```
if ('wheel' % 2 == 0) {
```
这实际上会导致 NaN，条件总是会导致 false。
你已经声明并实现了changeColor函数，但你实际上从未调用它。

为了让它工作，您可以简单地组合您的 changeColor 和 myFunction。
这是工作 demo:

function myFunction() {
    var x = Math.floor((Math.random() * 38) + 0);
    document.getElementById("wheel").innerHTML = x;
  
    if (x % 2 == 0) {
      document.body.style.backgroundColor = "red";
    } else {
      document.body.style.backgroundColor = "black";
    }
}

body {
  background-color: blue;
}

<button onclick="myFunction()">Spin the Wheel</button>

<p id="wheel" style="color: white;"></p>

Answer 2

更改您的 changeColor() 方法，如下所示。

 function changeColor() {
        var x = document.getElementById("wheel").innerHTML;

        if ((parseInt(x) % 2) == 0) {
            document.body.style.backgroundColor = "red";
        }
        else {
            document.body.style.backgroundColor = "black";
        }
    }

Answer 3

你所有的脚本都应该像这样放在页面正文的底部

<!DOCTYPE html>
<html>
<body bgcolor="blue"> 
 <p><font size="4" color="white"><b>First place a bet on a number or color. 
 <br>Then, spin the wheel to see if you win.</b></font></p> 

<button onclick="myFunction()">Spin the Wheel</button>

<font face="Jokerman" color="white" size="6"><p id="wheel"></p></font>

<script>
function myFunction() {
    var x = Math.floor((Math.random() * 38) + 0);
    document.getElementById("wheel").innerHTML = x;
}
</script>
<script type="text/javascript">

function changeColor () {
    if ( ('wheel' % 2) == 0) {
    document.body.style.backgroundColor = "red";
    }
    else {
    document.body.style.backgroundColor = "black";
}
}

</script>
</body>
</html>

以我在 JS 方面的技能水平和 jQuery 这就是我能帮到你的全部。希望这是一个开始！

无法创建 "if then" Javascript 语句来更改页面的背景颜色

Trouble creating "if then" Javascript statement to change background color of page

javascript

random

if-statement

background-color