Javascript 在删除行之后在表中为tr提供增量订单ID

我有以下格式的表格

<table>
    <tr>
      <td>
        <input type="hidden" name="help[0].id" />
      </td>
      <td> <span class="tr-close">X</span>
    </tr>
    <tr>
      <td>
        <input type="hidden" name="help[1].id" />
      </td>
      <td> <span class="tr-close">X</span>
    </tr>
    <tr>
      <td>
        <input type="hidden" name="help[2].id" />
      </td>
      <td> <span class="tr-close">X</span>
    </tr>
</table>

X
X
X

---

现在我有了Add按钮，它将把行添加到表的末尾。单击X图标时，我将删除整行。假设我删除了名为help[1].id的行，现在如果我再次添加新行，它应该有help[1].id..因此，在每次添加/删除时，名称应该有不同的递增非重复数字，如id的0,1,2,3..

删除行后，可以循环每个隐藏字段以更新name属性。您可以使用

.each（）

进行循环。使用

.attr（）

方法更新name属性

$(".tr-close").click(function(){
 $(this).parents("tr").remove();
 $("input[type=hidden]").each(function(i){

$(this).attr("name","help["+i+"]");
});
});

---

你可以这样做

//In order to have the dynamically created rows to have the

//delete function also you can use you on() like this    

$('table').on('click', '.tr-close', function(){

  $(this).parents('tr').remove();

});

// the #add refers to the add button you use

$('#add').click(function(){

  var counter = 0;

  $('table')

  .append('<tr><td><input type="hidden" name=""/></td><td> <span class="tr-close">X</span></td></tr>');

  $('tr').each(function(){

    $(this).find('input').prop('name', 'help[' + counter + '].id');

    counter++;

  });

});

//为了使动态创建的行具有
//delete函数也可以像这样在（）上使用
$（'table'）。在（'click'，'tr close'，function（）上{
$（this.parents（'tr'）.remove（）；
});
//#添加是指您使用的添加按钮
$（'#添加'）。单击（函数（）{
var计数器=0；
$（“表”）
.append（'X'）；
$（'tr'）。每个（函数（）{
$（this.find（'input'）.prop（'name'，'help['+counter+'].id'）；
计数器++；
});
});

我认为您可以使用“Heap”数据结构来维护已删除索引的最小数量。添加新行时从堆中拾取

RemoveRow -> 
    Insert index to Heap

AddRow ->
    if Heap is empty:
        Index = Rows.length
    else:
        Index = top of heap
        remove top of heap