Question

好吧，所以我和我的朋友对编程很陌生，我们有一些经验，但不是太多，而且我确定我们在这里犯了一个愚蠢的错误。我们正试图制作一个＆＃34; Rock，Paper，Scissors，Lizard，Spock＆＃34;使用HTML和JavaScript进行游戏。这是我们的代码：

<td>
        <p style="font-size: 12px; font-family: Arial;">Choose...</p>
            <form name="userInput"  action="javascript:getUserChoice">
                <input type="radio" name="userChoice" id="userChoice_rock" value="rock">Rock</input> </br>
                <input type="radio" name="userChoice" id="userChoice_paper" value="paper">Paper</input> </br>
                <input type="radio" name="userChoice" id="userChoice_scissors" value="scissors">Scissors</input> </br>
                <input type="radio" name="userChoice" id="userChoice_lizard" value="lizard">Lizard</input> </br>
                <input type="radio" name="userChoice" id="userChoice_spock" value="spock">Spock</input> </br>
                <input type="submit" value="Enter" />
            </form>
    </td>

    <script type="text/javascript">


    var userChoice = getUserChoice();

    function getUserChoice(userChoice)
    {

        if (document.userInput.getElementById('userChoice_rock').checked)
        {
        userChoice = "rock";
        }

        else if (document.userInput.getElementById('userChoice_paper').checked)
        {
        userChoice = "paper"
        }

        else if (document.userInput.getElementById('userChoice_scissors').checked)
        {
        userChoice = "scissors"
        }

        else if (document.userInput.getElementById('userChoice_lizard').checked)
        {
        userChoice = "lizard"
        }
        else if (document.userInput.getElementById('userChoice_spock').checked)
        {
        userChoice = "spock"
        }
}       

    </script>

我确定我们在这里犯了一个明显的错误。我一直在使用Chrome开发者工具（Inspect Element）来查找各种语法错误等。这对我来说可能不是很专业，但它值得一试。你看到有什么错误吗？我们知道如何为计算机选择和比较编写脚本，因为我们有经验。我们唯一的问题是定义用户选择。如果有人能帮助我解决这个问题，那真的很棒！

Answer 1

主要问题是你的全局var userChoice与函数的参数同名。函数getUserChoice over使用条件中设置的值写入其参数值。然后它没有做任何事情;一旦你离开了函数的范围，它就会丢失。

如果希望函数对全局变量进行操作，请不要为函数指定一个具有相同名称的参数。

第二个问题是你为函数的返回值赋予了全局变量userChoice，并且由于它没有返回任何内容，它实际上是用undefined写的值。因此即使你做了上述事情，它仍然无效。

未定义第四个document.userInput。您需要查询它，例如document.getElementById('userInput')。

总而言之，更好的解决方案是：

<html>
    <head>
        <script>
            var userChoice;

            var setUserChoice = function(event) {
                event.preventDefault();
                var choices = event.target.userChoice;

                for (var i =0; i < choices.length; i++) {
                    if (choices[i].checked) {
                        userChoice = choices[i].value;
                    }
                }

                event.target.choice.value = userChoice;
            }

            window.onload = function() {
                var form = document.getElementById('userInput');
                form.addEventListener('submit', setUserChoice, false);
            };
        </script>
    </head>

    <body>
        <form id="userInput">
                <input type="radio" name="userChoice" id="userChoice_rock" value="rock">Rock</input> </br>
                <input type="radio" name="userChoice" id="userChoice_paper" value="paper">Paper</input> </br>
                <input type="radio" name="userChoice" id="userChoice_scissors"value="scissors">Scissors</input> </br>
                <input type="radio" name="userChoice" id="userChoice_lizard" value="lizard">Lizard</input> </br>
                <input type="radio" name="userChoice" id="userChoice_spock" value="spock">Spock</input> </br>
                <input type="submit" value="Enter" /></br>
                <output name="choice"></output>
        </form>
    </body>
</html>

Answer 2

之后，即使在用户做出真正的选择之后，你也会在开始时调用getUserChoice方法，你必须将这个函数附加到这样的clic事件：

var submit_button = document.getElementById('mybutton');
submit_button.addEventListener('click', function() {
    getUserChoice();
}, false);

Answer 3

好的，2件事，首先我需要put（），没有我的firefox不要调用函数

<form name="userInput"  action="javascript:getUserChoice()">

第二，你需要改变：

if (document.userInput.getElementById('userChoice_rock').checked)

到

if (document.getElementById('userChoice_rock').checked)

因为userInput不是document

的成员

如果你现在放

alert(userChoice);

在函数结束时，您将在单击提交按钮

时获得userChoice

JavaScript函数没有运行？

3 个答案: