Javascript摇滚,纸,剪刀

时间:2014-08-24 11:56:20

标签: javascript html

我在http://www.codecademy.com上遵循Javascript教程,其中一部分是创建摇滚,纸张,剪刀游戏。在我完成它之后,我想我会重新设计它以便自己使用。所以我这样做了:

<!DOCTYPE html>
<html>
    <body>
        <script>
        var userChoice = document.getElementById("userChoice").value;

        if (userChoice != "rock" && userChoice != "paper" && userChoice != "scissors"){
            alert("Your choice was not rock, paper or scissors");
            userChoice = prompt("Do you choose rock, paper or scissors?");
        }
        var computerChoice = Math.random();
        if (computerChoice < 0.34) {
            computerChoice = "rock";
        } else if(computerChoice <= 0.67) {
            computerChoice = "paper";
        } else {
            computerChoice = "scissors";
        }

        var compare = function(choice1, choice2) {
            if (choice1 == choice2) {
                return "The result is a tie!";
            } else if (choice1 == "rock") {
                if (choice2 == "scissors") {
                    return "Rock wins";
                } else {
                    return "Paper wins";
                }
            } else if (choice1 == "paper") {
                if (choice2 == "rock") {
                    return "Paper wins";
                } else {
                    return "Scissors wins";
                }
            } else if (choice1 == "scissors") {
                if (choice2 == "paper") {
                    return "Scissors win";
                } else {
                    return "Rock wins";
                }
            }
        }

        function Run() {
            document.getElementById("pcc").innerHTML = "Computer: " + computerChoice;
            document.getElementById("result").innerHTML = compare(userChoice, computerChoice);
        }
    </script>
    <main>
        <h2>Choose between rock, paper or scissors: </h2>
        <input id="userChoice">
        <button onClick="Run()">Choose</button>
        <p id="pcc"></p>
        <p id="result"></p>
    </main>
</body>
</html>

但是它没有用,我没有为compare,computerChoice,userChoice定义,并且没有任何东西存在于value中。 怎么了?

2 个答案:

答案 0 :(得分:1)

您需要将脚本的所有内容放在一个函数中,试试这个。它试图在变量开始之前使用变量,因为开头的逻辑永远不会被调用:)

    function run(){  

    var userChoice = document.getElementById("userChoice").value;

    if (userChoice != "rock" && userChoice != "paper" && userChoice != "scissors"){
        alert("Your choice was not rock, paper or scissors");
        userChoice = prompt("Do you choose rock, paper or scissors?");
    }
    var computerChoice = Math.random();
    if (computerChoice < 0.34) {
        computerChoice = "rock";
    } else if(computerChoice <= 0.67) {
        computerChoice = "paper";
    } else {
        computerChoice = "scissors";
    }

    var compare = function(choice1, choice2) {
        if (choice1 == choice2) {
            return "The result is a tie!";
        } else if (choice1 == "rock") {
            if (choice2 == "scissors") {
                return "Rock wins";
            } else {
                return "Paper wins";
            }
        } else if (choice1 == "paper") {
            if (choice2 == "rock") {
                return "Paper wins";
            } else {
                return "Scissors wins";
            }
        } else if (choice1 == "scissors") {
            if (choice2 == "paper") {
                return "Scissors win";
            } else {
                return "Rock wins";
            }
        }
    }
        document.getElementById("pcc").innerHTML = "Computer: " + computerChoice;
        document.getElementById("result").innerHTML = compare(userChoice, computerChoice);
    }

答案 1 :(得分:0)

您应该删除<main>代码并正确关闭第二段代码,如下所示:

<p id="result"></p>