javascript - 删除行表拦截按钮？

Question

我有一个表，您可以在其中添加新行，也可以删除行。我使用过时的系统，我按下一个按钮并插入要删除的行，但这不是最好的。

现在，我为每一行创建一个显示“删除”的按钮，我将确保每次按下此按钮时，都会删除相应的行。 你能做到吗？

input5.onclick = function Ultimo(event)
                {
                    event = event || window.event;             
                    var row =  event.target || event.srcElement;
                    document.getElementById('table').deleteRow(row);
                    cont--;
                }

每次您在我的表单中按“+”时都会生成该按钮。 对于每个按钮隔膜，其 onclick 具有与删除行有关的功能。 Cont 是行计数器。

Answer 1

如果您只想将其从 DOM 中删除，那就非常简单了。您可以使用纯 Javascript 或 JQuery 来完成此操作。使用 JQuery 会更具可读性和可维护性。

纯 JavaScript 解决方案:

http://jsfiddle.net/k5mfe/

<table>
    <tr><td>One</td><td><a href="#" onclick="removeRow(this)">Delete</a></td></tr>
        <tr><td>Two</td><td><a href="#" onclick="removeRow(this)">Delete</a></td></tr>
        <tr><td>Three</td><td><a href="#" onclick="removeRow(this)">Delete</a></td></tr>
</table>


<script>
    function removeRow(el)
{
    var tr = el.parentElement.parentElement;
    tr.parentElement.removeChild(tr);

}
</script>

JQuery 解决方案

http://jsfiddle.net/k5mfe/1/

<script>
function removeRow(el)
{
    $(el).parents('tr').remove();
}
</script>