使用计算javascript动态添加表行

时间:2012-05-23 07:23:54

标签: javascript

我的HTML看起来像这样

<table>
    <tr>
        <td>Input 1</td>
        <td>Input 2</td>
        <td>Total</td>
        <td>&nbsp;</td>
        </tr>
            <tr>
        <td><input></td>
        <td><input></td>
        <td><input disabled></td>
        <td><button value="add">Add</button></td>
        </tr>
        <tr>
        <td>&nbsp;</td>
        <td>Grand Total</td>
        <td><input disabled ></td>
        <td>&nbsp;</td>
        </tr>
    </table>

我试图在两个输入之间进行计算,然后可以使用javascrtpt添加新行...请帮助我..

1 个答案:

答案 0 :(得分:1)

你可以通过两种方式为你的表提供id,访问你的表对象,然后通过table.innerhtml =你的新行标签添加一个新行。或者也是这样

function addRow(tableID) {
        inp1 = document.getElementByID(input1).value;
        inp2 = document.getElementByID(input2).value;
        if(your Logic to check inputs)
        {
        var table = document.getElementById(tableID);

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

        var cell1 = row.insertCell(0);
        var element1 = document.createElement("input");
        element1.type = "checkbox";
        cell1.appendChild(element1);

        var cell2 = row.insertCell(1);
        cell2.innerHTML = rowCount + 1;

        var cell3 = row.insertCell(2);
        var element2 = document.createElement("input");
        element2.type = "text";
        cell3.appendChild(element2);
        }
    }

用于演示访问here