JS 删除行问题

free_boy_xzh 2010-09-08 05:22:27

我要做的是一个买单的界面，当顾客不需要某个商品的时候，我们必须得删除该行，删除的同时要自动再统计总金额。现在我能实现删除选中行，可是只要我不安顺序删除表格中的行。数据就会出错。时间很紧。也不废话，代码贴上，希望大侠们多多指教。小弟谢过了。

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。谢谢（最大的问题就是不按顺序删除行，统计的值出问题。表格中的数据是根据扫描枪扫入得条码动态产生的。）

...全文

173 6 打赏收藏转发到动态举报

写回复

用AI写文章

6 条回复

切换为时间正序

请发表友善的回复…

发表回复

MrSLin 2010-09-09

打赏
举报

#2楼 V5!!

coderpig0730 2010-09-09

打赏
举报

xuexi

happy664618843 2010-09-09

打赏
举报

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);
}

swweb 2010-09-08

打赏
举报

楼上的强．

hoojo 2010-09-08

打赏
举报

<!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="hoojo_@126.com">

    <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>