修改订单
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>修改订单</title><style type="text/css">body{font-size:13px;line-height:25px;}table{border-top: 1px solid #333;border-left: 1px solid #333;width:400px;}td{border-right: 1px solid #333;border-bottom: 1px solid #333;text-align:center;}.title{font-weight:bold;background-color: #cccccc;}input text{width:100px;} </style></head><body><table border="0" cellspacing="0" cellpadding="0" id="order"> <tr type="button" value="删除" onclick="deleteRow(this);" /> <input id="edit1" type="button" value="修改" onclick="updateRow(this);" /></td> </tr> <tr> <td colspan="4" style="height:30px;"> <input name="addOrder" type="button" value="增加订单" /></td> </tr></table><script type="text/javascript">function $(id){return document.getElementById(id);}var table=$("order");window.onload=function(){//给“增加订单”注册点击事件document.getElementsByName("addOrder").item(0).onclick=addOrder;}//增加订单function addOrder(){var oldTr=table.rows[table.rows.length-2];var newTr=table.insertRow(table.rows.length-1);newTr.insertCell(0).innerHTML=oldTr.cells[0].innerHTML;newTr.insertCell(1).innerHTML=oldTr.cells[1].innerHTML;newTr.insertCell(2).innerHTML=oldTr.cells[2].innerHTML;newTr.insertCell(3).innerHTML=oldTr.cells[3].innerHTML;}//删除行function deleteRow(obj){var rowIndex=obj.parentNode.parentNode.rowIndex;if(confirm('是否要修改！')){table.deleteRow(rowIndex);}}//修改行function updateRow(obj){var rowIndex=obj.parentNode.parentNode.rowIndex;var cell=table.rows[rowIndex].cells[1];var num=cell.innerHTML;cell.innerHTML="<input type='text' name='number' value='"+num+"' style='width:30px'/>";obj.value="确定";obj.onclick=function(){okRow(this);}}//确定事件function okRow(obj){var rowIndex=obj.parentNode.parentNode.rowIndex;var cell=table.rows[rowIndex].cells[1];var num=cell.firstChild.value;cell.innerHTML=num;obj.value="修改";obj.onclick=function(){updateRow(this);}}</script></body></html>?
效果图：
?