jquery 添加表格行问题

以下代码，我想要在最底行放一个合计行，怎样可以让新添加的行在合计行上面呢？下面的代码只会在最后一行后面添加一行。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="js/jquery.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#BtAdd").click(function() {
　　　　//　复制一行
                var tr = $("#tb tr").eq(2).clone();
                tr.show();
                tr.appendTo("#tb");
            });
            $("#BtDel").click(function() {
// 删除一行
                $("#tb tr:gt(2)").each(function() {
                    if ($(this).find("#CK").get(0).checked == true) {
                        $(this).remove();
                    }
                });
             });
           
        })
    </script>
</head>
<body>
    <form id="form1">
    <div>
        <table id="tb" style=" border-collapse:collapse" border="1" cellpadding="0" cellspacing="0" bordercolor="#000000">
           <tr>
                <td colspan="10" style="text-align:right">
                    <input id="BtAdd" type="button" value="添加" />&nbsp;<input id="BtDel" type="button" value="删除" /></td>
            </tr>
            <tr>
                <td class="td"></td>
                <td class="td" style="width:20%;">
                    货物名称</td>
                <td class="td" style="width:20%;">
                    数量</td>
                <td class="td" style="width:15%;">
                    包装</td>
             </tr>
            <tr>
                <td style="text-align: center">
                    <input id="CK" type="checkbox" name="CK"/></td>
                <td style="text-align: center">
                    <input id="TName" type="text" name="TName" /></td>
                <td style="text-align: center">
                    <input id="TRm" type="text" name="TRm" /></td>
                <td style="text-align: center">
                    <select id="SType" name="SType" style=" width:100px;">
                        <option>1</option>
                        <option>2</option>
                    </select></td>
             </tr>
        </table>
    
    </div>
    </form>
</body>
</html>

解决方案 »

  1.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head runat="server"> 
        <title> </title> 
        <script type="text/javascript" src="file:///F:/Mine/jquery/lib/jquery-1.3.2.js"></script> 
        <script type="text/javascript"> 
            $(document).ready(function() { 
                $("#BtAdd").click(function() { 
    　　　　//　复制一行 
                    var tr = $("#tb tr").eq(2).clone(); 
                    //tr.show(); 
                    //tr.appendTo("#tb"); 
                    tr.insertBefore("#tb tr:last");
                }); 
                $("#BtDel").click(function() { 
    // 删除一行 
                    $("#tb tr:gt(2)").each(function() { 
                        if ($(this).find("#CK").get(0).checked == true) { 
                            $(this).remove(); 
                        } 
                    }); 
                }); 
              
            }) 
        </script> 
    </head> 
    <body> 
        <form id="form1"> 
        <div> 
            <table id="tb" style=" border-collapse:collapse" border="1" cellpadding="0" cellspacing="0" bordercolor="#000000"> 
              <tr> 
                    <td colspan="10" style="text-align:right"> 
                        <input id="BtAdd" type="button" value="添加" />&nbsp; <input id="BtDel" type="button" value="删除" /> </td> 
                </tr> 
                <tr> 
                    <td class="td"> </td> 
                    <td class="td" style="width:20%;"> 
                        货物名称 </td> 
                    <td class="td" style="width:20%;"> 
                        数量 </td> 
                    <td class="td" style="width:15%;"> 
                        包装 </td> 
                </tr> 
                <tr> 
                    <td style="text-align: center"> 
                        <input id="CK" type="checkbox" name="CK"/> </td> 
                    <td style="text-align: center"> 
                        <input id="TName" type="text" name="TName" /> </td> 
                    <td style="text-align: center"> 
                        <input id="TRm" type="text" name="TRm" /> </td> 
                    <td style="text-align: center"> 
                        <select id="SType" name="SType" style=" width:100px;"> 
                            <option>1 </option> 
                            <option>2 </option> 
                        </select> </td> 
                </tr> 
                <tr>
                <td>假设这行是合计</td><td></td><td></td><td></td>
                </tr>
            </table> 
        
        </div> 
        </form> 
    </body> 
    </html>
      

  2.   

    效果是出来了，但有报错：'find(...).get(...).checked' is null or not an object
      

  3.   


    if ($(this).find("#CK").get(0).checked) 这样
      

  4.   

    <script type="text/javascript"> 
            $(document).ready(function() { 
                $("#BtAdd").click(function() { 
    　　　　//　复制一行 
                    var tr = $("#tb tr").eq(2).clone(); 
                    //tr.show(); 
                    //tr.appendTo("#tb"); 
                    tr.insertBefore("#tb tr:last");
                }); 
                $("#BtDel").click(function() { 
    // 删除一行 
                    $("#tb tr:gt(2)").each(function() { 
                        if ($(this).find("#CK").attr('checked')) { 
                            $(this).remove(); 
                        } 
                    }); 
                }); 
              
            }) 
        </script>