javascript - 通过单击按钮添加行

Question

我的表格有两个用于添加不同行的按钮，我尝试了这段代码，但它不起作用。 这是我的脚本代码:

 function addRow(tableID) {
   var table = document.getElementById(tableID);
   var rowCount = table.rows.length;
   var row = table.insertRow(rowCount);
   var colCount = table.rows[1].cells.length;
   var cell1 = row.insertCell(0);
   cell1.innerHTML = rowCount;
   for (var i = 0; i < colCount; i++) {
     var newcell = row.insertCell(i + 1);
     newcell.innerHTML = table.rows[1].cells[i + 1].innerHTML;
   }
 }

<table>
  <tbody>
    <tr>
      <td width="550">
        <p><strong>Content</strong>
        </p>
      </td>
      <td width="50">
        <p align="center"><strong>CLO</strong>
        </p>
      </td>
      <td width="50">
        <p align="center"><strong>PLO</strong>
        </p>
      </td>
      <td width="60">
        <p align="center"><strong>Weeks</strong>
        </p>
      </td>
    </tr>
    <tr id="module">
      <td colspan="4" style="width:710; background-color:#A7B8D4; color:white;">
        <p class="modulenum"><strong align="center">MODULE 1</strong>
        </p>
      </td>
    </tr>
    <tr>
      <td valign="top" width="550">
        <p>
          <input type="text" value="" maxlength="255" class="textborder" class="table" id="dataTable2" />
        </p>
      </td>
      <td width="50">
        <p align="center">
          <input type="text" value="" maxlength="255" class="textbordersmall" />
        </p>
      </td>
      <td width="50">
        <p align="center">
          <input type="text" value="" maxlength="255" class="textbordersmall" />
        </p>
      </td>
      <td width="60">
        <p align="center">
          <input type="text" value="" maxlength="255" class="textbordersmall" />
        </p>
      </td>
    </tr>
    <tr style="border:0px;">
      <p>
        <input type="button" value="Add row" onclick="addRow1('dataTable2')">&nbsp; &nbsp;
        <input type="button" value="Add Module" onclick="addRow1('dataTable2')">
      </p>
      <br>
      <br>
    </tr>
  </tbody>
</table>
<p>&nbsp;</p>
</td>
</tr>
</tbody>
</table>

我希望当用户单击“添加模块”按钮时，它会重复模块行并增加其编号。但是当点击添加行按钮时，它只是重复行及其文本框。

Answer 1

问题:

• 按钮调用了错误的函数名称 addRow1 而不是 addRow
• 您向函数传递了一个 id，但表中没有

我已经修复了这些，并在 https://jsfiddle.net/0L4yy5rr/1/ 整理了代码