jquery动态添加行，如何实现添加行的name值自增？

以下代码可以实现动态添加行，但是INPUT的name值是一样的.
如何实现添加行的name值自增？
tr.find("td").get(0).innerHTML 如何修改呢？
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <script type="text/javascript" language="javascript" src="jquery.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            //隐藏模板tr
            //$("#tb tr").eq(2).hide();
            var i = 1;
            $("#BtAdd").click(function () {
                //复制一行
                var tr = $("#tb tr").eq(1).clone();
                tr.find("td").get(0).innerHTML = ++i;

//此行错误
                //tr.find("td").get(0).innerHTML ="<td style='text-align: center'>"+i+"</td><td><input id='CK"+i+"' type='checkbox' name='CK'/></td><td><INPUT class='INPUT' TYPE='text' NAME='qq"+i+"'></td>";                 tr.show();
                tr.appendTo("#tb");
            });
            $("#BtDel").click(function () {
                $("#tb tr:gt(1)").each(function () {
                    if ($(this).find("#CK").get(0).checked == true) {
                        $(this).remove();
                    }
                });
                i = 1;
                $("#tb tr:gt(1)").each(function () {
                    $(this).find("td").get(0).innerHTML = ++i;
                });
                $("#CKA").attr("checked", false);
            });
            $("#CKA").click(function () {
                $("#tb tr:gt(1)").each(function () {
                    $(this).find("#CK").get(0).checked = $("#CKA").get(0).checked;
                });
            });
        })
    </script>
 </HEAD> <BODY>
  <table border="1" id="tb">
    <tr>
                        <td style="text-align: center"></td>
                        <td><input id="CKA" name="CKA" type="checkbox"/></td>
<td>网名</td>
<td>博客</td>
<td>电邮</td>
<td>网络硬盘网络</td>
<td>QQ1</td>
<td>QQ2</td>
<td>QQ3</td>
<td>QQ4</td>
<td>QQ5</td>
<td>QQ6</td>
<td>QQ7</td>
    </tr>
    <tr>
                        <td style="text-align: center">1</td>
                        <td><input id="CK" type="checkbox" name="CK"/></td>
<td><INPUT class="INPUT" TYPE="text" NAME="qq"></td>
<td><INPUT class="INPUT" TYPE="text" NAME="ww"></td>
<td><INPUT class="INPUT" TYPE="text" NAME="ee"></td>
<td><INPUT class="INPUT" TYPE="text" NAME="rr"></td>
<td><INPUT class="INPUT" TYPE="text" NAME="tt"></td>
<td><INPUT class="INPUT" TYPE="text" NAME="yy"></td>
<td><INPUT class="INPUT" TYPE="text" NAME="uu"></td>
<td><INPUT class="INPUT" TYPE="text" NAME="ii"></td>
<td><INPUT class="INPUT" TYPE="text" NAME="oo"></td>
<td><INPUT class="INPUT" TYPE="text" NAME="pp"></td>
<td><INPUT class="INPUT" TYPE="text" NAME="aa"></td>
    </tr>
</table> <td width="50%" align="center">
<input id="BtAdd" type="button" value="添加行" Class="Btn"/>&nbsp;
                            <input id="BtDel" type="button" value="删除行"  Class="Btn"/>
        </td>
 </BODY>
</HTML>

解决方案 »

  1.   

    qq  要变成 qq1 qq2 这样 ？
      

  2.   

    NAME一样也无所谓的吧。反正一个FOR 循环就能遍历了
      

  3.   

      $(document).ready(function () {
                //隐藏模板tr
                //$("#tb tr").eq(2).hide();
                var i = 1;
                $("#BtAdd").click(function () {
                    //复制一行
                    var tr = $("#tb tr").eq(1).clone();
                    tr.find("td").get(0).innerHTML = ++i;
                    var inputs = tr.get(0).getElementsByTagName("input");
                    for(var j = 0 ; j < inputs.length; j ++)
                    {
                        inputs[j].name = inputs[j].name+(i-1)
                    }
                    //此行错误
                    //tr.find("td").get(0).innerHTML ="<td style='text-align: center'>"+i+"</td><td><input id='CK"+i+"' type='checkbox' name='CK'/></td><td><INPUT class='INPUT' TYPE='text' NAME='qq"+i+"'></td>";                 tr.show();
                    tr.appendTo("#tb");
                });
                $("#BtDel").click(function () {
                    $("#tb tr:gt(1)").each(function () {
                        if ($(this).find("#CK").get(0).checked == true) {
                            $(this).remove();
                        }
                    });
                    i = 1;
                    $("#tb tr:gt(1)").each(function () {
                        $(this).find("td").get(0).innerHTML = ++i;
                    });
                    $("#CKA").attr("checked", false);
                });
                $("#CKA").click(function () {
                    $("#tb tr:gt(1)").each(function () {
                        $(this).find("#CK").get(0).checked = $("#CKA").get(0).checked;
                    });
                });
            })
      

  4.   


    aspwebch 添加行测试已经没有问题了。发现中间删除了一行，name值得排序是不规则的，要怎么解决呢？
      

  5.   

    删除的时候对 tr循环 重新赋值name 。
      

  6.   


    $("table tr:last").parent().append("<tr>"+$("table tr:last").html()+"</tr>").end().next().find("input").each(function(i){$(this).attr("name",$(this).attr("name")+i)})放到你的页面运行一下。
      

  7.   

    我是通过隐藏表单域实现的，每次添加一行或者修改一行都去修改这个表单域的值，
    但是要实现让name累计并且是连续的优点困难，因为如果有添加一行或者删除一行都需要重新修改已有的name
      

  8.   

    可以把所有的操作完毕之后，加载函数单独对input进行name赋值$(":input").each(function(i){$(this).attr("name",i)});btw,为哈非要name属性？多一个不如少一个，又不是没有其他方法可以引用到他。
      

  9.   


    恩，如果行太多，修改的name会也很多，不知道会不会影响速度。
      

  10.   


    测试不通过，继续求解。
    删除操作如何改变name排序规则,按照name1,name2,name3排列
      

  11.   

    既然有删除或添加，建议不必一定要维持name1,2,3的顺序
    这个顺序对你有什么意义呢，重要的是能互相区别就可以了
      

  12.   


    如果不按照name1,2,3的顺序， 后台遍历中间的input会丢失。
    最初的想法是，获取行数的总数，然后遍历循环input，再insert到数据。
    或者各位有其他什么办法解决？
      

  13.   


    只要name各不相同，无论按何种顺序排列，都不可能遍历中丢失。
    不同的顺序只是决定了遍历的顺序，不会决定哪些不被遍历