我要做的是一个买单的界面,当顾客不需要某个商品的时候,我们必须得删除该行,删除的同时要自动再统计总金额。现在我能实现删除选中行,可是只要我不安顺序删除表格中的行。数据就会出错。时间很紧。也不废话,代码贴上,希望大侠们多多指教。小弟谢过了。
function deleteRow(){
var tbody = document.getElementById("mybody");
    var zmoney = document.getElementById("znum");
    var sum = 0;
if (tbody == null){
return;
}

// loop the rows
for (var i = tbody.rows.length - 1; i >= 0 ; i --){
// selected row
if (rowSelected(tbody.rows[i]))
 {// alert(tbody.rows.length+" "+document.getElementById("jine"+i+1).value);
  //  zmoney.value -= document.getElementById("jine"+i).value;
  tbody.removeChild(tbody.rows[i]);
 }
}

var checks = document.getElementsByName("checkItem");
var znum= document.getElementById("znum"); 
var newzum=0;
for(var i=checks.length;i>=1;i--) 
{  
  var tt = document.getElementById("jine"+i);
  if(tt=="" || tt==null || tt==undefined){
      newzum += 0;
  
   }else{
    newzum+=parseFloat(tt.value); 
    }

znum.value =newzum; 
document.getElementById("expenditure").value = newzum;
}

// check the special row is selected
function rowSelected(row){
var firstCell = row.cells[0];
var child = null;
for (var i = 0; i < firstCell.childNodes.length; i ++){
child = firstCell.childNodes[i];
if (child.type != undefined && child.type.toString() == "checkbox"){
return firstCell.childNodes[i].checked;
}
}
return false;
}时间来不及写这么多。希望遇到过此类问题或知道问题出在哪的请和我联系。QQ:516124730。谢谢(最大的问题就是不按顺序删除行,统计的值出问题。表格中的数据是根据扫描枪扫入得条码动态产生的。)

解决方案 »

  1.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>tableOper.html</title>

        <meta http-equiv="blog" content="blog.csdn.net/IBM_hoojo">
        <meta http-equiv="email" content="[email protected]">
        <meta http-equiv="author" content="hoojo">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <script type="text/javascript">
            var row_index = 0;
            //建立一个函数build_row()用于建立新的一行且增加的四个文本框为空的且被禁用  
            function build_row() {
                row_index++;
                var tab = document.getElementById("Table1");
                var new_row = tab.insertRow(Table1.rows.length);
                new_row.setAttribute("id", "row" + row_index);
                var new_col = new_row.insertCell(0);
                new_col.innerHTML = "<input type='text' id='T1" + row_index + "' name='T1' size='20' >";
                var new_col = new_row.insertCell(1);
                new_col.innerHTML = "<input type='text' id='T2" + row_index + "' name='T2' size='20' >";
                var new_col = new_row.insertCell(2);
                new_col.innerHTML = "<input type='text' id='T3" + row_index + "' name='T3' size='8' >";
                var new_col = new_row.insertCell(3);
                var prc = Math.round(Math.random()*13+1);
                new_col.innerHTML = "<input type='text' id='T4" + row_index + "' name='T4' size='8' value='" + prc + "'>";            var new_col = new_row.insertCell(4);
                new_col.innerHTML = "<input type='button' value='删除此行' id='B5" + row_index + "' name='B5' LANGUAGE='javascript' onclick=\"delete_row('row" + row_index + "')\">";
                var tab = document.getElementById("Table1");
                var count = tab.rows.length;
                if (count > 1) {
                 for (var i = 1; i < count; i ++) {
                var inp = tab.rows[i].getElementsByTagName("input");
                for (var j = 0; j < inp.length; j++) {
                 if (i != count - 1) {
                 if (inp[j].type != "button") {
                 inp[j].onclick = null;//不是最后一行,赋值null覆盖以前的事件
                 }
                } else {
                 if (inp[j].type != "button") {
                 inp[j].onclick = build_row;
                 }
                }
                }
                }
                }
            }
            
            function delete_row(id) {
             var tab = document.getElementById("Table1");
             /*var index = -1;
             for (var i = 0, len = tab.rows.length; i < len; i++) {
             if (tab.rows[i].id == id) {
             index = i;//实际所在行数,不能在循环中删除。这样表格的行数长度和循环的长度不一致
             break;
             }
             }
             if (index != -1) {
             tab.deleteRow(i);
             }*/
            
             //or
             tab.deleteRow(document.getElementById(id).rowIndex);
             getTotals();
            }
            
            function getTotals() {
             var price = document.getElementsByName("T4");
             var t = 0;
             for (var i = 0; i < price.length; i++) {
             t += Number(!price[i] ? 0 : price[i].value);
             }
             document.getElementById("totals").value = t;
            }
            
       window.onload = function () {
              for (i = 0; i < 5; ++i) {
                  build_row();
              }
              getTotals();
           }
        </script>
      </head>
      
      <body>
    <table border="1" width="80%" cellspacing="0" cellpadding="0" id="Table1">
    <tr>
    <th align="center" bgcolor="#E6E6E6" height="16">
    名称
    </th>
    <th align="center" bgcolor="#E6E6E6" height="16">
    规格
    </th>
    <th align="center" bgcolor="#E6E6E6" height="16">
    数量
    </th>
    <th align="center" bgcolor="#E6E6E6" height="16">
    单价
    </th>
    <th align="center" bgcolor="#E6E6E6" height="16">
    删除
    </th>
    </tr>
    </table>
    <div>
    <input type="text" id="totals"/>
    <input type="button" value="增加一行" name="B3" onclick="build_row()" />
    <input type="button" value="提交" name="btnSbumit" id="btnSubmit" />
    </div>
    </body>
    </html>
      

  2.   

    function delRow(event)
    {
     var aa;
     var tblen=$get("table1");
    var tt=tblen.rows.length;
    for(var i=0;i<tt;i++)
    {
      if(tblen.rows[i].parentNode=event.srcElement)
    {
     i=aa;
    }
    }
    deleteRow(aa);
    }