Javascript DOM事件清除文本值_Javascript_Html_Dom_Javascript Events

Javascript DOM事件清除文本值

javascript html dom

Javascript DOM事件清除文本值,javascript,html,dom,javascript-events,Javascript,Html,Dom,Javascript Events,我正在编写一个JS代码来计算给定个别分数的最终分数，并在html页面中输出结果，但当我触发事件和函数时，它会在一瞬间输出错误答案，然后立即与输入到文本框中的值一起消失 HTML: 问题2 等级计算器 HW/ HW/ 硬件/ 曲线+5？计算清楚的 JS: window.onload=pageLoad；函数pageLoad（） { var cbutton=document.getElementById（“comp”）； cbutton.onclick=compute； } 函数comp

我正在编写一个JS代码来计算给定个别分数的最终分数，并在html页面中输出结果，但当我触发事件和函数时，它会在一瞬间输出错误答案，然后立即与输入到文本框中的值一起消失

HTML:


问题2
等级计算器
HW/

HW/

硬件/
曲线+5？

计算
清楚的

JS:

window.onload=pageLoad；
函数pageLoad（）
{
var cbutton=document.getElementById（“comp”）；
cbutton.onclick=compute；
}
函数compute（）
{
var值=document.getElementsByTagName（“输入”）；
var评分=0；
var合计=0；
对于（变量i=0；i

不要使用

write

或

writeln

页面加载完成后，它将覆盖整个文档。在将其附加到DOM之前，我使用它检查结果，但我不知道这一点。即使在删除writeln语句后，在我单击任何按钮后，值仍然清晰，为什么会发生这种情况？必须将按钮类型设置为“按钮”，否则将提交表单并重新加载页面（默认的

类型为“提交”）

<!DOCTYPE html>
<html>
    <head>
        <title>Problem 2</title>
        <script src="grades.js" type="text/javascript"></script>
    </head>

    <body>
        <h1>Grade Calculator</h1>
        <form id ="myForm">
            <div id="assignments">
            HW <input type="text" size="1"/> / <input type="text" size="1"/><br/>
            HW <input type="text" size="1"/> / <input type="text" size="1"/><br/>
            HW <input type="text" size="1"/> / <input type="text" size="1"/>
            </div>

            <div>
                <input type="checkbox" /> Curve +5?
            </div>

            <div id="resultsarea">
                <p>
                    <!--add buttons here -->
                    <button id="comp">Compute</button>
                    <button id="clr">Clear</button>
                </p>

                <!-- add results here -->
            </div>
        </form>
    </body>
</html>

window.onload = pageLoad;

function pageLoad()
{
    var cbutton = document.getElementById("comp");
    cbutton.onclick = compute;
}

function compute()
{
    var values = document.getElementsByTagName("input");
    var marks = 0;
    var total = 0;
    for (var i=0; i < values.length; i++)
    {
        if(values[i].type == "text")
        {
            if (i%2 == 0)
            marks += parseInt(values[i].value);
            else
            total += parseInt(values[i].value);
        }
    }
    var result = Math.round(marks/total);
    document.writeln(result);
}