使用jquery删除表行

removing table row with jquery

本文关键字：删除 jquery 使用      更新时间：2023-09-26

我无法让这个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').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>');
  1. 您没有在tr中附加td
  2. #goal_form是表吗？如果没有，您就不能将表行附加到它上面

在这个答案的帮助下工作：

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

function removeGoal() 
{
    $('#goal_form tr:last').remove();
    count--;
}
相关文章：