Javascript 在追加行索引时动态删除每一行

我有点搞不清楚如何动态删除每一行，同时也相应地更新所有行索引，而不是第1,2,3行，在删除第2行时，这些行应该追加到1,2中，而不是保留在1,3中

jQuery(function(){
    jQuery('a.add-author').click(function(event){
        var number=document.getElementById("noofinputs").value;
        event.preventDefault();
        number++;

        var newRow = jQuery(
            '<tr>'+   
                '<td><textarea class="txtsize" name="item' +number + '" id="item' +number + '" rows="5" cols="32"></textarea></td>'+
                '<td><select name="category' +number + '" id="category' +number + '" style="width:202px;" >'+
                    <?php
                    $q3=mysqli_query($con,"select * from categories ORDER BY category ASC");
                    while ($row3 = mysqli_fetch_assoc($q3)){
                    ?>
                        '<option value="<?php echo $row3['no']; ?>"><?php echo $row3['category']; ?></option>'+
                    <?php
                    } 
                    ?>
                +'</select></td>'+
                '<td>$<input type="text" size="10" name="amount' +number + '" id="amount' +number + '" /></td>'+   
                '<td><a href="#" title="" class="remove-author'+number+'"><img style="cursor: pointer;" height="24px" width="24px;" src="http://../images/Cancel.png" /></a>    </td>'+
            '</tr>');

        jQuery('table.authors-list').append(newRow);
        $('#noofinputs').val(number);
    });
});

$(document).ready(function () {
$(".remove-author").click(function () {
     removeRow(this);
});
});

function removeRow(elem){
var i = 0;
var ii = 0;
var iii = 0;
$(elem).closest('tr').remove();
$("table.authors-list tr").not(':first').each(function (){
    $('td', this).not(':last').each(function() {
    $(this).find('textarea').each(function(){
        $(this).attr('name', 'item' + ( i+1 ));
        i++;
    });
     $(this).find('select').each(function(){
        $(this).attr('name', 'category' + ( ii+1 ));
        ii++;
     });
     $(this).find('input').each(function(){
        $(this).attr('name', 'amount' + ( iii+1 ));
        iii++;
     });
    });
});
var a=document.getElementById("noofinputs").value;
var b = (a - 1);
$('#noofinputs').val(b);    
}

我编辑了代码，但我甚至不能删除一行。。。 我试着跟着这个 但它根本不起作用

---

编辑：最后可以删除它，并在一些更改后重新编号其编号名称属性

编辑：看起来您需要从中删除该号码。就这样吧

您还希望删除$'.remove author'.eachfunction{

jQuery不会作用于动态创建的元素。因此，您可能希望创建一个新函数并将其注入元素中，这不是最好的解决方案，但它可以在不大量修改代码的情况下工作

所以你的代码应该是

$(document).ready(function () {
    $(".remove-author").click(function () {
         removeRow(this);
    });
});

function removeRow(elem){
    $(elem).closest('tr').remove();

    $("table.authors-list tr").each(function (i){
        var txt = $(this).find('textarea').attr('name');
        $(this).find('textarea').attr('name', txt.replace(/\d+/, i+1)); 
        var sel = $(this).find('select').attr('name');
        $(this).find('select').attr('name', sel.replace(/\d+/, i+1)); 
        var amt = $(this).find('input').attr('name');
        $(this).find('input').attr('name', amt.replace(/\d+/, i+1));
    });
}

现在您需要将其添加到元素中

---

这是因为在同一页上有多个remove author类，这就是它删除与该类匹配的最后一条记录的原因，您需要为此使用唯一的类或id。您好，在我的页面上，我将从这些表上的数据库加载一些数据，并且已经有很多行，删除按钮可以删除这些行，除了使用add按钮新建的行。remove标记需要jQuery的类。click函数。因此它应该是remove author，就是这样。该类不需要是唯一的，因为您调用$'.remove author'的代码。click将起作用。但我注意到，您有一个围绕该类的ave a.clickIt可以删除已经存在的行，但是如果我添加行，并尝试删除该行，它将不起作用..从元素的类中删除“+number+”后？是的，仍然不起作用..这是由于新创建行的索引行造成的吗？？

<a href="#" title="" class="remove-author" click="removeRow(this);">