用jquery删除表行答案

【问题标题】：removing table row with jquery用jquery删除表行
【发布时间】：2013-08-21 22:17:41
【问题描述】：

我不能完全让这个 javascript 工作 - 它被问了一百万次，我查看了很多关于 SO 的不同示例，但是......无济于事。

代码如下：

// modifed from http://stackoverflow.com/a/6520723/2128691

var count = 1;
var goal = 0;

$(function() {
    $('#add_goal').click(function() {
        addGoal();
    });
});

$(function() {
    $('#remove_goal').click(function() {
        removeGoal();
    });
});


function addGoal()
{
    $('#goal_form').append('<tr></tr>');
    $('#goal_form').append('<td class="goal_field fields"><input id="goal_goal" name="goal[goal]" placeholder="Students should..." size="30" type="text" /></td>');
    count++;
}

function removeGoal() 
{
    $('tr').remove();
    count--;
}

它非常接近工作，所以我认为这一定只是一个小问题 - 我可以根据需要添加任意数量的字段，并且可以删除一行，但只能删除一次。删除目标一次后，再次单击该链接不会执行任何操作（尽管“添加”仍然有效）。

【问题讨论】：

添加 $('tr', this).remove();

标签： javascript jquery

【解决方案1】：

这一行：

$('tr').remove();

将删除所有行。

另外，这些行没有意义

$('#goal_form').append('<tr></tr>');
$('#goal_form').
   append('<td class="goal_field fields"><input id="goal_goal" name="goal[goal]" placeholder="Students should..." size="30" type="text" /></td>');

您没有在 tr 中附加 td。
#goal_form 是一个表吗？如果不是，您不能只向其附加 表格行。

【讨论】：

#goal_form 是一个表格。不过，我更改了该代码以使其成为一行，谢谢。
@dax 你的意思是你把 td 放在了 tr 里面吗？
是的，让它工作，我在下面添加了一个答案。感谢您的帮助！

【解决方案2】：

得到这个答案的帮助：

https://stackoverflow.com/a/6570175/2128691

function removeGoal() 
{
    $('#goal_form tr:last').remove();
    count--;
}

【讨论】：