作者KAPP (时间が....)
看板Ajax
标题[问题] 表格删除列的问题
时间Wed Feb 27 18:08:56 2008
先稍微说明一下我的页面
一开始只有一个textfield和insert button
下方则是有个表格
今天当使用者在textfield自由输入後
可以在下方的表格中新增一列使用者所输入的值
并且在一旁有一个删除的钮
让使用者可以删除这一列
但我目前遇到的问题是
每次删除时都只能删除最後一列
我猜测问题应该是出在javascript的部份
可是却找不到真正有问题的部份
以下附上原始码:
这是test1.html
<html>
<head>
<script language="javascript">
function insert_click()
{
var form1 = document.getElementById("form1");
form1.submit();
}
function del_click(e)
{
var row=e.parentElement.parentElement;
var myTable = document.getElementById("myTable");
for(var i = 1 ; i < myTable.rows.length ; i++)
{
if(row.rowIndex==i)
{
myTable.deleteRow(i);
}
}
}
</script>
</head>
<body>
<form id="form1" name="form1" method="post" action="test2.html"
target="debug">
<input type=text size="10" name="input" id="input"></input>
<input type="button" name="insert" value="insert" onclick="insert_click()"
></input>
</form>
<table id="myTable" width="100" border="3" cellspacing="2" cellpadding="2">
<thead>
<tr>
<td>Num</td>
<td>Del</td>
</tr>
</thead>
<tbody id="grow">
</tbody>
</table>
<iframe name="debug" style="width:100%; height:250px; display:none;" >
</iframe>
</body>
</html>
这是test2.html
<html>
<head>
<script language="JavaScript">
function getGrow()
{
var input = parent.window.document.getElementById("input");
var td1 = document.getElementById("td1");
td1.value = input.value;
var grow = parent.window.document.getElementById("grow");
var growing = document.getElementById("growing");
grow.insertAdjacentElement('beforeEnd', growing);
td1.parentElement.id="row"+input.value;
}
</script>
</head>
<body onLoad="getGrow()">
<table width="100" border="3" cellspacing="2" cellpadding="2">
<tbody id="growing">
<tr id="row">
<td><input type="text" name="td1" id="td1" ></td>
<td><input type="button" name="del" id="del" value="删除"
onClick="del_click(this);"></td>
</tr>
</tbody>
</table>
</body>
</html>
程式新手 敬请给予指教
谢谢
--
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 140.115.126.164
※ 编辑: KAPP 来自: 140.115.126.164 (02/27 18:09)
※ KAPP:转录至看板 Web_Design 02/27 18:12
1F:推 mesak:跑不动这个程式.... 02/27 22:33
2F:→ TonyQ:单看这两个测试页 完全看不出你所提的问题 新增无法新增 02/27 22:34
3F:→ TonyQ:删除也无法删除。 02/27 22:34
4F:→ mesak:为什麽要post到 test2 去呢? 02/27 22:36
5F:→ KAPP:咦 在自己电脑上可以新增的说... 02/28 11:00
6F:推 TonyQ:你应该是没搞懂什麽是Server side的处理。 02/29 18:23