表格明细赋值问题
<html>
<head>
<title>my pages</title>
<script type="text/javascript" language="JavaScript">
var indexNumber = "01";
var clothePrice = new Array(4);
clothePrice[0] = 0;
clothePrice[1] = 1;
clothePrice[2] = 2;
clothePrice[3] = 3;
clothePrice[4] = 4;
clothePrice[5] = 5;
clothePrice[6] = 6;
clothePrice[7] = 7;
function onTypeChange(clothetype) {
var index = clothetype.selectedIndex;
var text = clothePrice[index];
document.getElementById("cost_Price").value = text;
if(document.getElementById("sold_Price").value != "") {
onGetPrice();
}
}
function onGetPrice() {
var sold_price = document.getElementById("sold_Price").value;
var cost_Price = document.getElementById("cost_Price").value;
document.getElementById("get_Price").value = sold_price - cost_Price;
}
function addaction(){
document.getElementById("net").value = 1000;
}
</script>
</head>
<body>
<div>
<table class="button">
<tr>
<td>
<button type = "button">Click me!</button>
</td>
</tr>
</table>
</div>
<div>
<table>
<tr>
<td align="center">
Date
</td>
<td align="center">
Number
</td>
<td align="center">
Style
</td>
<td align="center">
Cost
</td>
<td align="center">
SoldPrice
</td>
<td align="center">
Profit
</td>
</tr>
<tr>
<td>
<input type="text" name="sold_Date" id="sold_Date" />
</td>
<td align="right">
<label for="">01</label>
</td>
<td width="100px">
<select type="select" name="type" id="type" onchange="onTypeChange(this);">
<option value="0">type</option>
<option value="1">A</option>
<option value="2">B</option>
<option value="3">C</option>
<option value="4">D</option>
<option value="5">E</option>
<option value="6">F</option>
<option value="7">G</option>
</select>
</td>
<td align="right">
<input type="text" name="cost_Price" id="cost_Price" readonly="true"/>
</td>
<td align="right">
<input type="text" name="sold_Price" id="sold_Price" onchange="onGetPrice();"/>
</td>
<td align="right">
<input type="text" name="get_Price" id="get_Price" />
</td>
</tr>
<tr>
<td colspan="7">
</td>
<td align="right">
<button type = "button" onclick="addaction()">NET</button>
</td>
<td>
<input type="text" name="net" id="net" readonly="true"></label>
</td>
</tr>
</table>
</div>
</body>
</html>
这是小弟写的一个垃圾代码，现在追加一行，联动处理保持，大侠们该怎么弄，之前用过一个框架，tag直接能实现，但是现在单纯的用html，貌似只能通过js实现，但是初学js不是很会，请指点指点
[解决办法]
深度克隆节点就会连事件一起克隆了，不过你的事件是按照ID来设置，帮你改成按照节点关系来来设置了
- JScript code
<html><head><title>my pages</title><script type="text/javascript" language="JavaScript"> var indexNumber = "01"; var clothePrice = new Array(4); clothePrice[0] = 0; clothePrice[1] = 1; clothePrice[2] = 2; clothePrice[3] = 3; clothePrice[4] = 4; clothePrice[5] = 5; clothePrice[6] = 6; clothePrice[7] = 7; function onTypeChange(o) { var index = o.selectedIndex; var text = clothePrice[index]; var tr = o.parentNode.parentNode; //document.getElementById("cost_Price").value = text; tr.cells[3].getElementsByTagName('input')[0].value = text; if (tr.cells[4].getElementsByTagName('input')[0].value != "") { onGetPrice(); } } function onGetPrice(o) { var tr = o.parentNode.parentNode, sold_price = parseInt(o.value,10); var cost_Price = parseInt(tr.cells[3].getElementsByTagName('input')[0].value, 10); //document.getElementById("get_Price").value = sold_price - cost_Price; tr.cells[5].getElementsByTagName('input')[0].value = sold_price - cost_Price; } function addaction() { document.getElementById("net").value = 1000; } function addRow() { var tr = document.getElementById('trTpl').cloneNode(true);///////// tr.removeAttribute('id'); document.getElementById('tbList').appendChild(tr) tr.cells[1].innerHTML = tr.parentNode.rows.length < 10 ? '0' + tr.parentNode.rows.length.toString() : tr.parentNode.rows.length; }</script></head><body><div><table class="button"><tr><td><button type = "button" onclick="addRow()">Click me!</button></td></tr></table></div><div><table><tr><td align="center">Date</td><td align="center">Number</td><td align="center">Style</td><td align="center">Cost</td><td align="center">SoldPrice</td><td align="center">Profit</td></tr><tbody id="tbList"><tr id="trTpl"><td><input type="text" name="sold_Date" id="sold_Date" /></td><td align="right"><label for="">01</label></td><td width="100px"><select type="select" name="type" id="type" onchange="onTypeChange(this);"><option value="0">type</option><option value="1">A</option><option value="2">B</option><option value="3">C</option><option value="4">D</option><option value="5">E</option><option value="6">F</option><option value="7">G</option></select></td><td align="right"><input type="text" name="cost_Price" id="cost_Price" readonly="true"/></td><td align="right"><input type="text" name="sold_Price" id="sold_Price" onchange="onGetPrice(this);"/></td><td align="right"><input type="text" name="get_Price" id="get_Price" /></td></tr></tbody><tr><td colspan="7"></td><td align="right"><button type = "button" onclick="addaction()">NET</button></td><td><input type="text" name="net" id="net" readonly="true"></label></td></tr></table></div></body></html>