0

我是 JavaScript 新手,正在尝试为我的学校编写此代码。最终目标是制作一个期末成绩计算器,学生可以在其中输入他们当前的成绩,程序输出他们在期末考试中需要得分以保持一定百分比。该程序应该适用于加权课程,其中教师对不同的作业/测试不同的数量进行加权。问题是一些教师使用的类别比其他教师多,这就是为什么有一个 for 循环。使用以下内容,用户可以输入所有信息,但我无法将额外的类别权重和等级存储为变量,因此我无法对它们进行数学运算。如果这有任何意义,如果您知道如何存储在 for 循环中输入的值,我将不胜感激。

<html>

<head>
    <script type='text/javascript'>
        function addFields() {
            // Number of inputs to create
            var number = document.getElementById("category_weight").value;
            // Container <div> where dynamic content will be placed
            var container = document.getElementById("container");
            // Clear previous contents of the container
            while (container.hasChildNodes()) {
                 container.removeChild(container.lastChild);
            }
            for (i = 0; i < number; i++){
                // create a row element to contain each pair
                var row = document.createElement("div");
                row.id = 'row' + i

                row.appendChild(document.createTextNode("Category " + (i+1) + " weight: "));
                var weight_input = document.createElement("input");
                weight_input.type = "number";
                weight_input.name = "weight";
                row.appendChild(weight_input);

                row.appendChild(document.createTextNode("Category " + (i+1) + " percentage: "));
                var percentage_input = document.createElement("input");
                percentage_input.type = "number";
                percentage_input.name = "percentage";
                row.appendChild(percentage_input);

                // append inputs to row instead of container, then append each row to container
                container.appendChild(row);
            }
        }
        function weighted() {

            var container = document.getElementById("container");
            var rows = container.children;
            for (var i = 0; i < rows.length; i++) {
               var row = rows[i];
               var weight = row.children[0].value;  // or row.querySelectorAll('[name=weight]').value;
               var percentage = row.children[1].value;
               console.log(weight, percentage);
             }


        // not important for now - will do the calculations here
        // var E = "";
        //
        // var A = parseFloat(document.getElementById("goal_grade").value);
        // var B = parseFloat(document.getElementById("exam_weight").value);
        //
        //
        // var E = A + B;
        //
        // if ( E <= 0) {
        //   E = 0;
        // }
        //
        //
        // document.getElementById("result").innerHTML = E;
        // document.getElementById("totpoints").innerHTML = B;
        }
    </script>
 </head

 <body>
    <span>What final percentage in the class are you trying to reach or stay above?</span>
    <input type="number" id="goal_grade" name="goal_grade" />

    <br>
    <br>

    <span>What percent is the final exam weighted?</span>
    <input type="number" id="exam_weight" name="exam_weight" />

    <br>
    <br>

    <span>How many extra weighted categories are there?</span>
    <input type="number" id="category_weight" name="category_weight" value=""> <br />
    <button type="button" onclick="addFields()">Submit </button>
    <div id="container"></div>

    <br>
    <br>

    <input type="button" value="Calculate" onclick="weighted()" />

    <br>
    <br>

    <span>You will need to get <p id="result" name="r1"> </p> points out of the ... <p id="totpoints" name="tot_points"> </p> points possible on the final"
</span>

</body>

 </html>
4

2 回答 2

0

不太明白你的问题出在哪里。您可以将所有额外的加权类别存储在一个数组中。

例如:

var categories = [];
categories.push(value);

对于您的问题,价值可以是加权类别(权重 + 百分比)。您的代码应如下所示:

<html>

<head>
    <script type='text/javascript'>
        function addFields() {
            // Number of inputs to create
            var number = document.getElementById("category_weight").value;
            // Container <div> where dynamic content will be placed
            var container = document.getElementById("container");
            // Clear previous contents of the container
            while (container.hasChildNodes()) {
                 container.removeChild(container.lastChild);
            }
            for (i = 0; i < number; i++){
                // create a row element to contain each pair
                var row = document.createElement("div");
                row.id = 'row' + i

                row.appendChild(document.createTextNode("Category " + (i+1) + " weight: "));
                var weight_input = document.createElement("input");
                weight_input.type = "number";
                weight_input.name = "weight";
                row.appendChild(weight_input);

                row.appendChild(document.createTextNode("Category " + (i+1) + " percentage: "));
                var percentage_input = document.createElement("input");
                percentage_input.type = "number";
                percentage_input.name = "percentage";
                row.appendChild(percentage_input);

                // append inputs to row instead of container, then append each row to container
                container.appendChild(row);
            }
        }
        function weighted() {

            var container = document.getElementById("container");
            var rows = container.children;
            // The categories array initialization
            var categories = [];
            for (var i = 0; i < rows.length; i++) {
               var row = rows[i];
               var weight = row.children[0].value;  // or row.querySelectorAll('[name=weight]').value;
               var percentage = row.children[1].value;
               // Pushing a specific category that contains weight and percentage (Defined by a JSON struction)
               categories.push({
                    weight: weight,
                    percentage: percentage
               });
               console.log(weight, percentage);
             }


        // not important for now - will do the calculations here
        // var E = "";
        //
        // var A = parseFloat(document.getElementById("goal_grade").value);
        // var B = parseFloat(document.getElementById("exam_weight").value);
        //
        //
        // var E = A + B;
        //
        // if ( E <= 0) {
        //   E = 0;
        // }
        //
        //
        // document.getElementById("result").innerHTML = E;
        // document.getElementById("totpoints").innerHTML = B;
        }
    </script>
 </head

 <body>
    <span>What final percentage in the class are you trying to reach or stay above?</span>
    <input type="number" id="goal_grade" name="goal_grade" />

    <br>
    <br>

    <span>What percent is the final exam weighted?</span>
    <input type="number" id="exam_weight" name="exam_weight" />

    <br>
    <br>

    <span>How many extra weighted categories are there?</span>
    <input type="number" id="category_weight" name="category_weight" value=""> <br />
    <button type="button" onclick="addFields()">Submit </button>
    <div id="container"></div>

    <br>
    <br>

    <input type="button" value="Calculate" onclick="weighted()" />

    <br>
    <br>

    <span>You will need to get <p id="result" name="r1"> </p> points out of the ... <p id="totpoints" name="tot_points"> </p> points possible on the final"
</span>

</body>

</html>

稍后在您的计算中,您可以在类别数组上进行 for 循环,并根据您推送到数组中的类别进行计算

于 2017-04-24T04:50:36.857 回答
0

只需在javascript中使用数组。我已经使用了数组,您的页面现在工作正常。你可以检查它并告诉是否有问题......

    <html>

<head>
    <script type='text/javascript'>
        var w = [];
        var p = [];
        var result = 0;
        function addFields() {
            // Number of inputs to create
            var number = document.getElementById("category_weight").value;
            // Container <div> where dynamic content will be placed
            var container = document.getElementById("container");
            // Clear previous contents of the container
            while (container.hasChildNodes()) {
                 container.removeChild(container.lastChild);
            }
            for (i = 0; i < number; i++){
                // create a row element to contain each pair
                var row = document.createElement("div");
                row.id = 'row' + i

                row.appendChild(document.createTextNode("Category " + (i+1) + " weight: "));
                var weight_input = document.createElement("input");
                weight_input.type = "number";
                weight_input.name = "weight";
                row.appendChild(weight_input);

                row.appendChild(document.createTextNode("Category " + (i+1) + " percentage: "));
                var percentage_input = document.createElement("input");
                percentage_input.type = "number";
                percentage_input.name = "percentage";
                row.appendChild(percentage_input);

                // append inputs to row instead of container, then append each row to container
                container.appendChild(row);
            }
        }
        function weighted() {

            var container = document.getElementById("container");
            var rows = container.children;
            for (var i = 0; i < rows.length; i++) {
               var row = rows[i];
               w[i] = row.children[0].value;  // or row.querySelectorAll('[name=weight]').value;
               p[i] = row.children[1].value;

             }

             for(var i =0; i < rows.length; i++){
               // You can do as much calculation here with w[i] & p[i]
                 result += w[i]*p[i];
             }
             console.log(result);

        // not important for now - will do the calculations here
        // var E = "";
        //
        // var A = parseFloat(document.getElementById("goal_grade").value);
        // var B = parseFloat(document.getElementById("exam_weight").value);
        //
        //
        // var E = A + B;
        //
        // if ( E <= 0) {
        //   E = 0;
        // }
        //
        //
        // document.getElementById("result").innerHTML = E;
        // document.getElementById("totpoints").innerHTML = B;
        }
    </script>
 </head

 <body>
    <span>What final percentage in the class are you trying to reach or stay above?</span>
    <input type="number" id="goal_grade" name="goal_grade" />

    <br>
    <br>

    <span>What percent is the final exam weighted?</span>
    <input type="number" id="exam_weight" name="exam_weight" />

    <br>
    <br>

    <span>How many extra weighted categories are there?</span>
    <input type="number" id="category_weight" name="category_weight" value=""> <br />
    <button type="button" onclick="addFields()">Submit </button>
    <div id="container"></div>

    <br>
    <br>

    <input type="button" value="Calculate" onclick="weighted()" />

    <br>
    <br>

    <span>You will need to get <p id="result" name="r1"> </p> points out of the ... <p id="totpoints" name="tot_points"> </p> points possible on the final"
</span>

</body>

 </html>

我希望这能解决你的问题:)

于 2017-04-24T04:51:08.960 回答