一个字段中添加序列号使用jQuery克隆

Question

我已经实现jQuery的克隆如下面的链接：

http://jsfiddle.net/sunalive/gqQnJ/5/

现在我想的序列号（行号）每次都自动生成一行被添加（克隆）。另外，当一行被删除（通过DelRow按钮）时，我需要重新编号（这样当我们从中间删除一行时，序列中没有缺失的数字）。该号码必须在lineNo字段中显示。

任何人都可以帮我实现这个目标吗？

此外，我需要从第一行隐藏'DelRow'按钮，以便所有行不会意外删除，并且至少有一行始终存在（但是这是正在克隆的行，我需要按钮显示在所有其他克隆行中）。

感谢您的时间和帮助。

更新：谢谢Charles和Kei的热心帮助。我必须融合你的两个解决方案才能达到我想要的。更新后的解决方案是贴在下面：

http://jsfiddle.net/sunalive/gqQnJ/13/

Answer 1

http://jsfiddle.net/gqQnJ/10/但你承担，因为ID lineNo的是重复的ID的HTML是无效的。所以我认为你应该用另一种方式来选择或识别输入。

Answer 2

DEMO

$(document).ready(function() { 
    var autonumber = function() { 
     $("tr.gridrow").each(function(i) { 
      $(this).find("input[name='lineNo']").val(i + 1); 
     }); 
    }; 
    autonumber(); 

    var emptyItems = $(".gridrow:first").clone(); 
    $(".addrow").live('click', function(e) { 
     e.preventDefault(); 
     $(this).parents('.gridcontainer').append(emptyItems.clone()); 
     autonumber(); 
    }); 

    $(".delrow").live('click', function(e) { 
     e.preventDefault(); 
     $(this).parents('.gridrow').remove(); 
     autonumber(); 
    }); 
}) 

当心，你没有用相同的ID克隆标签。您最好使用班级。