1

我有一个简单的 Javascript 数学程序。它可以让你回答方程式，当它检查你的答案时，它会提醒你回答正确还是错误。

这是添加的代码：

function randomAdd()
        {
            var x=document.getElementById("AddN1");
            x.value=Math.floor((Math.random()*12)+1);

            var y=document.getElementById("AddN2");
            y.value=Math.floor((Math.random()*12)+1);
        }

        function checkAdd()
        {
            var z=document.getElementById("AddA2");
            z.value= parseInt(document.getElementById("AddN1").value) + parseInt(document.getElementById("AddN2").value);


            if(parseInt(document.getElementById("AddA1").value)==z.value)
            {
                score=score+1;
                alert("Addition: Correct");
            }
            else
            {
                alert("Addition: Incorrect");
            }
        }
<form name="Addition">
        <table>
            <tr>
                <th>Addition</th> <th></th> <th></th> <th></th> <th></th> <th></th>
            </tr>
            <tr>
                <th>Number 1</th> <th></th> <th>Number 2</th> <th></th> <th>Type Your Answer</th> <th>Correct Answer</th>
            </tr>
            <tr>
                <td><input type="text" name="AddN1" id="AddN1"></td> <td>+</td> <td><input type="text" name="AddN2" id="AddN2"></td> <td>=</td> <td><input type="text" name="AddA1" id="AddA1"></td> <td><input type="text" name="AddA2" id="AddA2"></td>
            </tr>
            <tr>
                <td><input type="button" value="Get Numbers" onclick="randomAdd();"> <td></td> <td></td> <td></td> <td><input type="button" value="Check Answer" onclick="checkAdd();"> <th></th>
            </tr>
        </table>
</form>

代码是我的大学提供给我的。我想保留一个简单的计数器来计算用户获得的所有正确答案，以及一个重置按钮，将计数器重置为零？

对不起，如果这听起来很基础，但我没有使用 Javascript 的经验。

谢谢。

4

2 回答 2

2

我还没有测试过，但我怀疑你的代码在默认情况下几乎可以工作，但唯一的问题是你没有score在全局范围内声明你的变量，这样其他函数就可以访问同一个变量而无需进一步传递。

添加var score = 0;到页面顶部应该使它工作，以后使用它而不var喜欢score++;增加一，score = 0;重置它等等..其余的代码我留给你一个谜，因为它的学校工作 - 只是想en-向您介绍全局变量的使用。:) 但是尽量避免创建大量全局变量，因为它也被称为不好的做法，尽管有时没有它们很难生活。从全局变量中阅读更多内容，不好的做法？

您的代码的一些调试提示：

var scoreElement=document.getElementById("score");

此行是在加载 DOM 之前执行的，因此它可能为 null.. 尝试更改行：

alert("Addition: Correct");
scoreElement.value=score;

至

document.getElementById("score").value=score;

还将所有 javascript 移动到页面底部（例如在：</body>标签下） - 这是正确的方法。还有为什么你在不真正使用 jquery.js 的时候加载它？例如，您可以将所有 javascript 代码添加到准备好的内部文档中。像这样：

$(function() {

    // your javascript code

});
于 2013-03-17T13:42:59.937 回答
1

您只需要在函数 checkAdd() {} 之外声明这样的变量 score

var score=0;

然后它也会提醒正确或不正确，之后可以显示分数对不起，现在我添加了resetScore功能

<form name="Addition">
        <table>
            <tr>
                <th>Addition</th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
            </tr>
            <tr>
                <th>Number 1</th>
                <th></th>
                <th>Number 2</th>
                <th></th>
                <th>Type Your Answer</th>
                <th>Correct Answer</th>
                <th>SCORE</th>
            </tr>
            <tr>
                <td>
                    <input type="text" name="AddN1" id="AddN1">
                </td>
                <td>+</td>
                <td>
                    <input type="text" name="AddN2" id="AddN2">
                </td>
                <td>=</td>
                <td>
                    <input type="text" name="AddA1" id="AddA1">
                </td>
                <td>
                    <input type="text" name="AddA2" id="AddA2">
                </td>
                <td>
                    <input type="text" name="score" id="score" value="0" readonly>
                </td>
            </tr>
            <tr>
                <td>
                    <input type="button" value="Get Numbers" onclick="randomAdd();">
                <td></td>
                <td></td>
                <td></td>
                <td>
                    <input type="button" value="Check Answer" onclick="checkAdd();">
                </td>
                <td></td>
                <td>
                    <input type="button" value="Reset Score" onclick="resetScore();">
                </td>
            </tr>
        </table>
</form>
<script type="text/javascript">
var score=0;
function resetScore()
{   
    score=0;
    document.getElementById("score").value=score;
}
function randomAdd()
        {
            var x=document.getElementById("AddN1");
            x.value=Math.floor((Math.random()*12)+1);

            var y=document.getElementById("AddN2");
            y.value=Math.floor((Math.random()*12)+1);
        }


        function checkAdd()
        {
            var z=document.getElementById("AddA2");
            z.value= parseInt(document.getElementById("AddN1").value) + parseInt(document.getElementById("AddN2").value);

            if(parseInt(document.getElementById("AddA1").value)==z.value)
            {
                //score=score+1;
                score++;
                alert("Addition: Correct");
                document.getElementById("score").value=score;
            }
            else
            {   
                //score=score-1;
                score--;
                alert("Addition: Incorrect");
                document.getElementById("score").value=score;
            }
        }

</script>
于 2013-03-17T13:06:08.407 回答