<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>動態添加刪除行</title>

</head>

<body>
<form id="form1" name="form1" method="post" action="">
<table width="200" border="1" id="tb">
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  
  <tr>
    <td><input type="text" name="heji" value="" /></td>
    <td>heji</td>
    <td>heji</td>
    <td>heji</td>
    <td>heji</td>
    <td>heji</td>
    <td>heji</td>
    <td>heji</td>
  </tr>
</table>

<p>&nbsp;</p>

  <label>
  <input type="text" name="YZBZGG" />
  </label>
</form>
<p>
  <input name="添加行" type="button" onclick="addrow()" value="添加行" />
</p>
<script language="JavaScript">

function addrow()
{
    var i = tb.rows.length;     //i為表格的長度
    //tb為需要添加行的表格的ID
    //var ss  = document.form1.YZBZGG.value;
    var objRow = tb.insertRow(i-1);

    for (j = 0; j <= 7; j++)   //一共8個td
    { 
        objCel = objRow.insertCell(j);   //開始插入td
        objCel.className = "tdclass";    //td的class屬性
        switch (j) {
            case 0:
                objCel.innerHTML = '<input type="text" class="tdinput" name=JYPH >';
                objCel.firstChild.value=document.form1.YZBZGG.value; 
                //此行是把yzbzgg這個input框內的數據放入這個td的input中 如果你還需要設置更多，在下面幾行添加這一行就行了。
                break;
            case 1:
                objCel.innerHTML = '<input type="text" class="tdinput" name=JYPH >';
                break;
            case 2:
                objCel.innerHTML = '<input type="text" class="tdinput" name=JYPH >';
                break;
            case 3:
                objCel.innerHTML = '<input type="text" class="tdinput" name=JYPH >';
                break;
            case 4:
                objCel.innerHTML = '<input type="text" class="tdinput" name=JYPH >';
                break;
            case 5:
                objCel.innerHTML = '<input type="text" class="tdinput" name=JYPH >';
                break;
            case 6:
                objCel.innerHTML = '<input type="text" class="tdinput" name=JYPH >';
                break;
            case 7:
                objCel.innerHTML = '<a href="javascript:delrow()">刪除一行</a>';
                break;
            default: ;
        }
    }
    sum();
}
function delrow()
{
    var i = tb.rows.length;
            tb.deleteRow(i-2);
    sum();
}
function sum()
{
    var i = tb.rows.length;
    var sum=0;
    for(j=1;j<i-1;j++)
    {
        if(tb.rows.length==3)
        {
            sum = document.form1.aa.value;
        }
        else
        {            
        sum += parseFloat(document.form1.aa[j-1].value);
        }
    }
    document.form1.heji.value= sum;
}

</script>
<input type="reset" name="Submit" value="sum" onclick="sum()"  />
</body>
</html>
可能還沒有太完善~注釋我也會繼續加的