<table border=1 align="center" width="80%">
   <tr>
     <th>
     编号
     </th>

  <th>单价</th>
  <th>数量</th>
  <th>金额</th>
  <th>操作</th>
   </tr>

   <tbody id="t">
         <tr  align="center">
      <td>1</td>
   <td>10</td>
   <td>
      <input onkeyup="js(this)">
   </td>
   <td>
       0
   </td>

   <td>
      <input type=button value="+" onclick="addRow()">
      <input type=button value="-" onclick="delRow(this)">
   </td>
   </tr>
   </tbody>

</table>
   <div style="float:right">
   总金额:<span div="sum">0</span>
   </div>

   <script>
      //新增一行
      function addRow()
   {
         var t = document.getElementById("t");
   //得到表格的第一行，并克隆
   var tr = t.rows[0].cloneNode(true);
   t.appendChild(tr);

   //清空数量
   tr.cells[2].childNodes[0].value="";

   bh();
   }

   //删除一行
   function delRow(btn)
   {
          var tr =  btn.parentNode.parentNode;
    tr.parentNode.removeChild(tr);
    bh();
   }

   //重新编号
   function bh()
   {
           var t = document.getElementById("t");
     for (var i=0;i<t.rows.length ;i++ )
     {
         t.rows[i].cells[0].innerHTML = i+1;
     }
   }

   //计算金额
   function js(txtNum)
   {
       var num   = txtNum.value; //数量
       if (isNaN(num))
       {
         alert("只能是数字");
      txtNum.value = num.substring(0,num.length-1);
      return;
       }
          var tr = txtNum.parentNode.parentNode;
    var price = tr.cells[1].innerHTML; //单价
   
    var money = price*num;
    tr.cells[3].innerHTML = money;
   }
   </script>