JAVASCRIPT动态增加表格,如何实现input 值的计算

Question

我要实现点选择商品出现一个对话框,然后选择对应的商品放到表格相应的内容中,填写了单价,数量之后能自动计算出总价,并在总价中显示,请各位指导一下,谢谢. 
<form name=form1>
  <table>
   <tr>
 <td align=center>
   <table width=100% border="1"  id="testTbl" bgcolor="#CCCCCC">
     <tr>
      <td align=center width=6%>选择</td><td align=center width=6%>序列</td><td align=center width=8%>选择商品</td><td align=center width=17%>产品名称</td> <td align=center width=17%>型号规格</td><td align=center width=11%>单价</td><td align=center width=11%>数量</td><td align=center width=11%>总价</td>
     </tr>
     
       
   </table>
 </td>
 </tr>
 <tr>
   <td>总计:<input type=text name="zjg"></td>
 </tr>
<tr>
  <td align=center>
  <input name='litif' type='hidden'  value="0" /><input type=button onClick="addRow(testTbl)" value=新增>
  <input type=button value=删除 class="del" onClick="delRow(testTbl)">
  <input type=submit value="确定"></td>
  </tr>
  </table>
</form>
<script>
/**
* 添加
*/
function sett(table){
  
form1.dj2.value="ni";
}
function addRow(table){//获得表格的行数
var row = table.rows.length;//获得表格的列数
var cell = table.rows[0].cells.length;//添加行
var newTr = table.insertRow();
newTr.bgcolor = "#ffffff";//添加列
for(var j=1;j<=cell;j++){
   var newTd = newTr.insertCell();
   add(newTd,j,row);
}
}/**
*删除行
*/
function delRow(table){
var cks = document.forms[0].ck;
if(cks!=undefined){
   if(cks.length==undefined){
    if(cks.checked){
     table.deleteRow(1);
    }
   }else{
    for(var i=0;i<cks.length;i++){
     var ck = cks[i];
     if(ck.checked){
      var number = i + 1;
      table.deleteRow(number);
      cks = document.forms[0].ck;
      //全部删除时
      if(cks==undefined){
      var row = table.rows.length;
       return;
      }
      i--;
     }
    }
   }
}trimNumber(table);
}/**
*排号
*/
function trimNumber(table){
var rows = table.rows.length-1;
for(var i=1;i<=rows;i++){
   var row = table.rows[i];
   row.cells[1].innerText = i;
}
var row = table.rows.length;}/**
*为列添加文本
*/
function addText(newTd,text){
newTd.innerText = text;
}/**
*为列添加标签
*/
function addHTML(newTd,HTML){
newTd.innerHTML = HTML;
}function add(newId,cell,row){
if(cell==1){ addHTML(newId,"<input type='checkbox' value='"+(row+1)+"' name='ck'/>");
   newId.align = "center";
   
}else if(cell==2){
  addText(newId,row);
   newId.align = "center";
  
}else if(cell==3){
  addHTML(newId,"<input type='button' name='cpdj"+(row+1)+"' style='width:100%' value='单击选择商品' onClick='openss()' />");
  
}else if(cell==6){
 addHTML(newId,"<input type='text' name='dj"+(row+1)+"' style='width:100%;text-align:center' onchange='opess(testTbl)'/>");
}
else if(cell==4){
 addHTML(newId,"<input type='text' name='cpname"+(row+1)+"' style='width:100%;text-align:center' onchange='opess(testTbl)'/>");
}
else if(cell==5){
 addHTML(newId,"<input type='text' name='cpxh"+(row+1)+"' style='width:100%;text-align:center' onchange='opess(testTbl)'/>");
}
else if(cell==7){
 addHTML(newId,"<input type='text' name='sl"+(row+1)+"' style='width:100%;text-align:center' onchange='oped(testTbl)'/>");
}
else if(cell==8){
   addHTML(newId,"<input type='text' name='rt"+(row+1)+"'   style='width:100%;text-align:center'/>");
}
newId.style.background = "#FFFFFF";
}
function openss(){
alert("ni hao");
}
function oped(){
alert("ni hao");
}
function opess(table){
 var oRow;
  var curr_row;
  var name;
  var name2;
  var row = table.rows.length;
  for( oRow=2;oRow<=row;oRow++)
  {
     name="rt"+oRow; 
     alert(name);
    form1.rt2.value="2";
 form1.zjg.value="2";
 }
}
</script>

Answer 1

太乱了,给你做了下选择商品功能 其余的看不下去了
addHTML(newId," <input type='button' name='cpdj"+(row+1)+"' style='width:100%' value='单击选择商品' onClick='openss(this)' />"); function openss(obj){ 
var oval = window.showModalDialog("sel.html",null,"DialogWidth:300px;DialogHeight:200px");
obj.parentNode.nextSibling.firstChild.value = oval;
} sel.html  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <SCRIPT LANGUAGE="JavaScript">
  <!--
function ret(oli){
self.close();
window.returnValue = oli.innerText;
}
  //-->
  </SCRIPT>
 </HEAD> <BODY>
  <li onclick="ret(this)">aa</li>
  <li onclick="ret(this)">bb</li>
  <li onclick="ret(this)">cc</li>
 </BODY>
</HTML>