Question

我正在尝试用javascript创建一个Craps游戏，用于我正在教授的介绍课程。我有最初的“出来”滚动工作并显示第二个按钮滚动点。单击第二个按钮时，它将显示警报，但不会使用新的滚动信息覆盖段落ID。它持有我的点变量值并将其写入警告框，但它不会将其写入文档。我正在复制并粘贴整个页面。我已经完成了测试，所以为了测试目的，这些内容已被注释掉了。

<!-- INCOMPLETE -->
<html>
    <head>
        <script>

            var point = 0;  
            function intro()
            {
                document.getElementById('button2').style.visibility = 'hidden';
                document.getElementById('intro').innerHTML = 'This is the Come-Out roll.<p>Click the button to roll.</p>';
            }

            function pointRoll()
            {
                alert("test");
                //  while (pointDice01 + pointDice02 != point)
                //  {
                //      var pointDice01 = Math.floor((Math.random() * 6) + 1);
                //      var pointDice02 = Math.floor((Math.random() * 6) + 1);

                        document.getElementById("Dice01").innerHTML = point;
                        document.getElementById("Dice02").innerHTML = point;
                //  }
            }


                function main()
                {

                    // Math.random returns a number between 0 and 1, but not including 1.
                    // Thus, we have to multiply by the number we want to go to (6)
                    // We use the floor to round down and we add 1 so 0 is not included.
                    var dice01 = Math.floor((Math.random() * 6) + 1);
                    var dice02 = Math.floor((Math.random() * 6) + 1);

                    document.getElementById("dice01").innerHTML = dice01;
                    document.getElementById("dice02").innerHTML = dice02;

                    // if (Condition to lose the game) else if (Condition to win) else (keep playing)
                    if(dice01 + dice02 == 2 || dice01 + dice02 == 3 || dice01 + dice02 == 12) // Come out roll. Crapped out
                    {
                        total = dice01 + dice02;
                        document.getElementById("pointPara").innerHTML = "Total is " + total + ".";
                        document.getElementById("crapResults").innerHTML = "You Crapped Out! Roll again.";
                    }
                    else if (dice01 + dice02 == 7 || dice01 + dice02 == 11) // Come out roll. A Natural, Pass line wins
                    {
                        total = dice01 + dice02;
                        document.getElementById("pointPara").innerHTML = "Total is " + total + ".";             
                        document.getElementById("crapResults").innerHTML = "A Natural! Pass line wins!!! Roll again.";
                    } 
                    else
                    {
                        document.getElementById("buttonPara").style.visibility = "hidden";
                        document.getElementById("button2").style.visibility = "visible";
                        point = dice01 + dice02;
                        //alert(point);
                        document.getElementById("intro").innerHTML = "";
                        document.getElementById("pointPara").innerHTML = "Your point value is " + point + ".<p>Try to reach this number again before rolling a 7.";
                        document.getElementById("crapResults").innerHTML = "";
//                      return false;
                    }
                }   

        </script>
    </head>
    <body onLoad = intro()>
        <p id = "intro"></p>


        <p id = "buttonPara"><button onclick = "main()">Click Me.</button></p>
        <p id = "dice01"></p>
        <p id = "dice02"></p>
        <p id = "pointPara"></p>
        <p id = "crapResults"></p>

        <p><input type="button" id = "button2" value = "Click here for point." onClick = "pointRoll();" /></p>


    </body>
</html>

Answer 1

试试这个：你提供错误的id。

document.getElementById("dice01").innerHTML = point;
document.getElementById("dice02").innerHTML = point;

而不是：

document.getElementById("Dice01").innerHTML = point;
document.getElementById("Dice02").innerHTML = point;

查看您的代码，我想您要设置：

document.getElementById("dice01").innerHTML = pointDice01;
document.getElementById("dice02").innerHTML = pointDice02;

而不是设置point的值。

Answer 2

在

document.getElementById("Dice01").innerHTML = point;
document.getElementById("Dice02").innerHTML = point;

您已在大写情况下指定了元素名称。将其更改为

document.getElementById("dice01").innerHTML = point;
document.getElementById("dice02").innerHTML = point;

并且有效

第二个按钮显示警报但不会运行功能

2 个答案: