0

我需要将表单中的给定值添加到表中,如何使用 java 脚本来实现。

我已经包含了代码。到目前为止我做了什么。

在这里,我创建了一个表单和两个命令按钮来添加和删除一行,

现在我需要的是我在我创建的表格中输入的值应该反映在我创建的表上。

请帮助我实现这一目标。

    <script language="javascript">
    function deleteRow(i)
    {
    document.getElementById('table1').deleteRow(i)
    }
    function addRow()
    {
    var tbody = document.getElementById("table1").getElementsByTagName("tbody")[0];
    var row = document.createElement("TR");
    var cell1 = document.createElement("TD");
    var inp1 =  document.createElement("INPUT");
    inp1.setAttribute("type","text");
    inp1.setAttribute("value","");
    cell1.appendChild(inp1);
    var cell2 = document.createElement("TD");
    var inp2 =  document.createElement("INPUT");
    inp2.setAttribute("type","text");
    inp2.setAttribute("value","");
    cell2.appendChild(inp2);
    var cell3 = document.createElement("TD");
    var inp3 =  document.createElement("INPUT");
    inp3.setAttribute("type","text");
    inp3.setAttribute("value","");
    cell3.appendChild(inp3);
    var cell4 = document.createElement("TD");
    var inp4 =  document.createElement("INPUT");
    inp4.setAttribute("type","button");
    inp4.setAttribute("value","Delete");
    inp4.setAttribute("onClick", "deleteRow(this.parentNode.parentNode.rowindex)");
    cell4.appendChild(inp4);

    row.appendChild(cell1);
    row.appendChild(cell2);
    row.appendChild(cell3);
    row.appendChild(cell4);
    tbody.appendChild(row);

   //alert(row.innerHTML);
    }
    </script>

    <tr>
    <td>
    F.Name : &nbsp;
    </td>
    <td><input type="text" value="" id="fname"></td>
    </tr>
    <br> <br>
    <tr>


    <td>
    L.Name : &nbsp;
    </td>

    <td><input type="text" value="" id="lname"></td>
    </tr>
    <br> <br>
    <tr>

    <td>
    items  : &nbsp;  &nbsp;
    </td>
    <td width="98"><select name="select" id="item">
        <option value="item1" selected="selected">item1</option>
        <option value="item2">item2</option>
        <option value="item3">item3</option>
        <option value="item4">item4</option>
        <option value="item5">item5</option>

      </select></td>

    </tr>
    <br> <br>
    <input type="button" value="Add Row" onClick="addRow();">
    <br> <br>
    <table id="table1">
    <tbody>
    <tr>
    <td><input type="text" value=""></td>
    <td><input type="text" value="" width="10"></td>
    <td><input type="text" value="" width="10"></td>

    <td><input type="button" value="Delete"         onclick="deleteRow(this.parentNode.parentNode.rowIndex)">

    </td>
    </tr>
    </tbody>
    </table>
4

1 回答 1

0

当您手动创建行时,为什么不管理一个 ID 逻辑,该逻辑将生成和管理动态分配给列的 ID,然后您可以轻松地填充它们,只是您需要这样做。

document.getelementbyID("IDofElement").innerHTML = your content.

您肯定需要使用一种逻辑来生成 ID 并将其分配给动态元素

于 2012-05-16T07:30:56.603 回答