求帮看一段代码 关于表格行删除和插入问题

以下代码可以通过增加订单按钮生成行，但是无法给新生成的行的id赋值，导致无法用删除按钮定位id来删除该行。
希望大大帮助解决这个问题！<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>网上订单.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<style type="text/css">
#div1 {
margin: 0 auto;
}.title {
text-align: center;
font-weight: bold;
background-color: #cccccc;
}td {
text-align: center;
border: 1px solid black;
}
</style>
<script type="text/javascript">
var row_index;
var newRow;
var uRow;
var addRow;
function addBooking() { newRow = document.getElementById("myTable");
row_index = parseInt(newRow.rows.length - 1);
addRow = newRow.insertRow(row_index);
addRow.id = "tri"+row_index;
var col1 = addRow.insertCell(0);
col1.innerHTML = "<input type='text' size='20' name='row_index'/>";
var col2 = addRow.insertCell(1);
col2.innerHTML = "<input type='text' size='3' />";
var col3 = addRow.insertCell(2);
col3.innerHTML = "<input type='text' size='5'  value='&yen;&nbsp;'/>";
var col4 = addRow.insertCell(3);
col4.innerHTML = "<button onclick='delRow()'>删除</button>" + "&nbsp;"
+ "<button onclick='confirmBooking()'>确定</button>";
    }
function confirmBooking() {
alert(document.getElementById("myTable").rowIndex);
}
function delRow() {}
</script> </head> <body>
<div id="div1">
<table width="100%" cellspacing="0" id="myTable">
<tr class="title">
<td>
商品名称
</td>
<td>
数量
</td>
<td>
单价
</td>
<td>
操作
</td>
</tr>
<tr>
<td colspan="4" style="text-align: center">
<input name="b3" type="button" value="增加订单" onclick="addBooking()" />
</td>
</tr>
</table> </div>
</body>
</html>

解决方案 »

  1.   


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title>网上订单.html</title><meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=gbk"><!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
    <style type="text/css">
    #div1 {
    margin: 0 auto;
    }.title {
    text-align: center;
    font-weight: bold;
    background-color: #cccccc;
    }td {
    text-align: center;
    border: 1px solid black;
    }
    </style>
    <script type="text/javascript">
    var row_index;
    var newRow;
    var uRow;
    var addRow;
    function addBooking() {newRow = document.getElementById("myTable");
    row_index = parseInt(newRow.rows.length - 1);
    addRow = newRow.insertRow(row_index);
    addRow.id = "tri"+row_index;
    var col1 = addRow.insertCell(0);
    col1.innerHTML = "<input type='text' size='20' name='row_index'/>";
    var col2 = addRow.insertCell(1);
    col2.innerHTML = "<input type='text' size='3' />";
    var col3 = addRow.insertCell(2);
    col3.innerHTML = "<input type='text' size='5' value='&yen;&nbsp;'/>";
    var col4 = addRow.insertCell(3);
    col4.innerHTML = "<button onclick='delRow(this)'>删除</button>" + "&nbsp;"
    + "<button onclick='confirmBooking()'>确定</button>";
        }
    function confirmBooking() {
    alert(document.getElementById("myTable").rowIndex);
    }
    function delRow(t) {
    t.parentNode.parentNode.parentNode.removeChild(t.parentNode.parentNode)
    }
    </script></head><body>
    <div id="div1">
    <table width="100%" cellspacing="0" id="myTable">
    <tr class="title">
    <td>
    商品名称
    </td>
    <td>
    数量
    </td>
    <td>
    单价
    </td>
    <td>
    操作
    </td>
    </tr>
    <tr>
    <td colspan="4" style="text-align: center">
    <input name="b3" type="button" value="增加订单" onclick="addBooking()" />
    </td>
    </tr>
    </table></div>
    </body>
    </html>老楼 试试
      

  2.   

    抱歉，因为我代码没有写好，我没办法正确获取，当前行的rowIndex 所以我跑上来请求帮助了。