HTML / Javascript成绩平均计算

时间:2016-09-08 18:04:54

标签: javascript html

我目前正在编写一个HTML / JavaScript程序,经过几天的研究和学习而没有解决问题已经打了几天。我的程序/网站有一个表格,要求用户输入4个不同类别的成绩。然后在单击按钮计算平均值时,应该采用这4个值,然后使用正确的权重对它们求平均值,然后在新的页面分区中显示输出。我无法显示输出,我无法弄清楚原因。

如果这很简单并且之前已得到回答,我道歉。

<html>
<head>
    <title> Grade Average Calculator </title>
</head>

<body>

<p>
    <h2>Grade Average Calculator</h2>
    <h3>Please Enter Your Grade For Each Section</h3>
    <TABLE BORDER=2 CELLSPACING=2 CELLPADDING=2>

    <tr>
    <td>Type</td>
    <td>Weight</td>
    <td>Grade</td>
    </tr>

    <tr>
    <td>Homework</td>
    <td>25%</td>
    <td><input type="text" id="homework" size=2 value=""></td>
    </tr>

    <tr>
    <td>Labs</td>
    <td>20%</td>
    <td><input type="text" id="labs" size=2 value=""></td>
    </tr>

    <tr>
    <td>Midterm</td>
    <td>25%</td>
    <td><input type="text" id="midterm" size=2 value=""></td>
    </tr>

    <tr>
    <td>Final Exam</td>
    <td>30%</td>
    <td><input type="text" id="finals" size=2 value=""></td>
    </tr>

    <br><br>
</p>
    <input type="button" value="Calculate Your Grade"
        onclick="calculator()">

    <hr>
    <div id="outputDiv" style="height: 50px; width: 100%;"></div>

    <script type="text/javascript">

        function calculator()
        {
            var grade1=parseFloat(document.getElementById('homework').value*0.25);
            var grade2=parseFloat(document.getElementById('labs').value*0.20);
            var grade3=parseFloat(document.getElementById('midterm').value*0.25);
            var grade4=parseFloat(document.getElementById('finals').value*0.30);
            var total=grade1+grade2+grade3+grade4;

            var display=document.getElementById('outputDiv')display.innerHTML='Your Final Grade Is: ';
        }
    </script>
</body>

1 个答案:

答案 0 :(得分:1)

我更新了您的代码。问题是你从未显示过总数,只是显示了

  

&#39;您的最终成绩是:&#39;

round