javascript - getElementsByName:不起作用

我的函数calc（）无法正常工作！

在这里，我想将价格和金额字段中的数据相乘，然后将其放入字段总和中。

当我使用getElementsById时，它适用于第一行，但是当我添加新行时，它不适用于新行数据。

请告诉我是否可以使用getElementsByName或getElementsById吗？

function addRow(billingTable)
{
            var table = document.getElementById(billingTable);

    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);

    var colCount = table.rows[0].cells.length;

    for (var i = 0; i < colCount; i++)
    {
        var newcell = row.insertCell(i);

        newcell.innerHTML = table.rows[1].cells[i].innerHTML;
        //alert(newcell.childNodes);
        switch(newcell.childNodes[0].type)
        {
            case "text":
                newcell.childNodes[0].value = "";
                break;
            case "checkbox":
                newcell.childNodes[0].checked = false;
                break;
        }
    }
}

function deleteRow(billingTable)
{
    try {
        var table = document.getElementById(billingTable);
        var rowCount = table.rows.length - 1;

        for (var i = 1; i <= rowCount; i++)
        {

            var row = table.rows[i];

            var chkbox = row.cells[0].children[0];
            if (null != chkbox && true == chkbox.checked)
            {
                if (rowCount <= 1)
                {
                    alert("Alle zeilen kann nicht gelöscht werden.");
                    break;
                }
                table.deleteRow(i);
                rowCount--;
                i--;
            }

        }
    } catch(e)
    {
        alert(e);
    }
}
function calc()
{

    var amount = document.c("Amount")[0];
    alert(amount);
    var price = document.getElementsByName("Price");
    document.getElementsByName('Sum') . value = amount*price;

}



<table border="1" id="billingTable">
            <tr>
                <th></th>
                <th>Position</th>
                <th>Amount</th>
                <th>Price</th>
                <th>Sum</th>
            </tr>
            <tr>
                <td>
                <INPUT type="checkbox" name="chk"/>
                </td>
                <td>
                <input type="text" name="Position" style="width: 140px"/>
                </td>
                <td>
                <input type="text" id="Amount_1" name="Amount" style="width: 140px"/>
                </td>
                <td>
                <input type="text" id="Price_1" name="Price" style="width: 139px" onchange="calc()"/>
                </td>
                <td>
                <input type="text" id="Sum_1" name="Sum" style="width: 139px"/>
                </td>
            </tr>


        </table>

最佳答案

方法getElementsByName返回一个节点列表，该列表可以像数组一样使用。您需要做的就是抓住它们并循环遍历，以便对所有行进行计算。

function calc()
{
    var amounts = document.getElementsByName("Amount");
    var prices = document.getElementsByName("Price");
    var sums = document.getElementsByName('Sum');

    for(var i=0; i<amounts.length; i++)
    {
        sums[i].value = amounts[i].value * prices[i].value;
    }
}

关于javascript - getElementsByName:不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/17041371/