跑步比分/测验游戏

debugcn 发表于 Dev

咸味索尔塔斯

我是一个初学者，我正在研究这个测验类型的程序。它需要先问一些预先创建的问题，然后检查答案是否正确，调整跑步成绩，然后显示下一个问题。我完成了所有其他工作，但是让我陷入困境的部分是这部分。

<!doctype html>
    
    <html lang="en">
    <head>
        <title>Group Project</title>
    </head>
    <body>
        <script text="text/javascript">
            var a = 0;
            var b = 0;
            document.write(a, "/", b)  
            function score() {
                
            
            var a = 0;
            var b = 0;
              
            if (document.question.one.value=="10") {
                ++a;
                ++b;
               
            }
            else{
                ++b;
                
            }
            document.write(a, "/", b)
            }
        </script>
        
        
        <form name="question"><br>
            <input type="text" name="one"/><br>
            <input type="button" value="Submit" onclick="score()" />
            
            
        </form>

我在IF语句中选择了10，只是为了看到增量工作原理，但是当我在文本输入中输入10时会发生什么，页面会重新加载，仅显示创建的分数，而没有按钮或文本输入。我如何做到这一点，使分数或分数保持不变，并且不需要重新加载完整的页面即可增加？

dfsq

您不希望使用document.write它，因为它会清除所有文档以编写新内容。相反，您应该更改某些DOM元素的内部文本内容，例如div。例如：

<form name="question">
    <div id="score"></div>
    <input type="text" name="one" />
    <br>
    <input type="button" value="Submit" onclick="score()" />
</form>

<script text="text/javascript">
    var a = 0;
    var b = 0;
    
    write(a, b);

    function score() {

        var a = 0;
        var b = 0;

        if (document.question.one.value == "10") {
            ++a;
            ++b;
        } else {
            ++b;
        }
        write(a, b);
    }
    
    function write(a, b) {
        document.getElementById('score').innerHTML = a + "/" + b;
    }
</script>

在上面的代码中，我介绍了帮助程序功能write，该功能在div#scorediv中显示作用域文本。

还要注意，脚本现在write位于form元素之后，以确保函数可以div#score在执行时找到（HTML应该在那时加载）。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。