Js订单增删改

最新推荐文章于 2023-07-11 16:55:14 发布

S宋憨憨

最新推荐文章于 2023-07-11 16:55:14 发布

阅读量231

点赞数

文章标签： java

本文链接：https://blog.youkuaiyun.com/S2662015043/article/details/124082780

版权

本文主要介绍了使用JavaScript进行订单管理的相关操作，包括如何增加新的订单行，执行删除操作以及对已有订单信息进行修改的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

增加行

	function addRow(){
				// 2.开始增加行
				var rowIndex = myTable.rows.length-1;
				var newRow = myTable.insertRow(rowIndex);// 目前是空行
				// 给新增加的行对象 newRow添加 id属性
				newRow.setAttribute("id",rowIndex);
				// 第1个单元格
				var c0 = newRow.insertCell(0);
				c0.innerHTML = "<input type='text'/>";
				// 第2个单元格
				var c1 = newRow.insertCell(1);
				c1.innerHTML = "<input type='text' style='width:30px'/>";
				// 第3个单元格
				var c2 = newRow.insertCell(2);
				c2.innerHTML = "<input type='text' style='width:30px'/>";
				// 第4个单元格
				var c3 = newRow.insertCell(3);
				c3.innerHTML = "<input type='button' value='删除' οnclick=\"delRow("+newRow.id+")\"/>&nbsp;"+
								"<input type='button' value='确定' οnclick=\"qd("+newRow.id+")\"/>";
			}

删除

function delRow(rid){
				// 1.通过行id获取行对象。
				var myRow = document.getElementById(rid);
				// 2.获取行下标
				var rindex = myRow.rowIndex;
				// 3.开始删除行
				myTable.deleteRow(rindex);
			}
			// 确定功能
			function qd(rid){//参数：当前操作行的id属性
				// 1.获取要操作的行，通过行id
				console.info("rid = "+rid);
				var myRow = document.getElementById(rid);
				// 2.获取当前行里面前三个单元格里面文本框的内容，并把文本框的内容赋给单元格
				// 获取当前行的所有单元格，返回的是一个存储单元格的数组
				var cs = myRow.cells;
				// 第1个单元格
				var c0 = cs[0].firstChild.value;
				// 将获取的文本框的值赋给第1个单元格
				cs[0].innerHTML = c0;
				
				// 第2个单元格
				var c1 = cs[1].firstChild.value;
				// 将获取的文本框的值赋给第2个单元格
				cs[1].innerHTML = c1;
				
				// 第3个单元格
				var c2 = cs[2].firstChild.value;
				// 将获取的文本框的值赋给第3个单元格
				cs[2].innerHTML = c2;
				// 3.确定按钮变为修改按钮，修改按钮的 value属性值。操作的是第4列/单元格
				cs[3].lastChild.value="修改";
				cs[3].lastChild.setAttribute("onclick","update('"+rid+"')")
			}

修改

	function update(rid){
				// 1.获取要操作的行，通过行id
				var myRow = document.getElementById(rid);
				// 2.获取单元格的内容并赋给一个文本框，最后将文本框赋给单元格。
				var cs = myRow.cells;
				// 第1个单元格
				var c0 = cs[0].innerHTML;
				console.info(c0);
				cs[0].innerHTML = "<input type='text' value="+c0+" />";
				
				// 第2个单元格
				var c1 = cs[1].innerHTML;
				cs[1].innerHTML = "<input type='text' style='width:30px' value="+c1+" />";
				
				// 第3个单元格
				var c2 = cs[2].innerHTML;
				cs[2].innerHTML = "<input type='text'  style='width:30px' value="+c2+" />";
				// 3.修改按钮变为确定钮
				cs[3].lastChild.value="确定";
				// 再次调用确定方法
				cs[3].lastChild.setAttribute("onclick","qd('"+rid+"')")
			}