Question

我知道Stack Overflow上有关于这个特定主题的数千个答案，但是我已经阅读了3天3夜，已经尝试将解决方案应用到我的代码中但没有成功。

问题是addRow工作正常，但DeleteRow根本不起作用。

这是我的HTML：

<input type="button" value="add" onClick="addRow('dataTable')" /> 
<input type="button" value="delete" onclick="deleteRow(this)"/> 
<p></p>
</p>
</table>
<table id="dataTable" class="cv" border="1">
  <tr>
    <td>
      <input type="text" style="width:100%" placeholder="ievadiet valodu">
    </td>
    <td>
      <select id="BX_gender" name="BX_gender" required="required">
        <option>dzimtā valoda</option>
        <option>teicami</option>
        <option>labi</option>
        <option>viduvēji</option>
        <option>pamatzināšanas</option>
      </select>
    </td>
    <td>
      <select id="BX_gender" name="BX_gender" required="required">
        <option>teicami</option>
        <option>labi</option>
        <option>viduvēji</option>
        <option>pamatzināšanas</option>
      </select>
    </td>
    <td>
      <select id="BX_gender" name="BX_gender" required="required">
        <option>teicami</option>
        <option>labi</option>
        <option>viduvēji</option>
        <option>pamatzināšanas</option>
      </select>
    </td>
  </tr>
</table>
<div class="clear"></div>
</fieldset>

的javascript：

function addRow(tableID) {
    var table = document.getElementById(tableID);
    var rowCount = table.rows.length;
    if (rowCount < 5) {
        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[0].cells[i].innerHTML;
        }
    } else {
        alert("Maksimālais ierakstu skaits ir 7.");
    }
}

function DeleteRow(o) {
    //no clue what to put here?
    var p = o.parentNode.parentNode;
    p.parentNode.removeChild(p);
}

以下是代码工作的小提琴（仅addRow函数）：http://jsfiddle.net/7AeDQ/690/

Answer 1

假设您要删除最后一行，可以使用类似

的内容

function deleteRow() {
     var table = document.getElementById("dataTable");
    var tbody = table.tBodies[0];
         tbody.removeChild(tbody.lastChild);
    }

更新了小提琴here

使用类似的东西，你不需要使用parentNode.parentNode来遍历DOM ...

删除HTML表格行

1 个答案: