Chinaunix首页 | 论坛 | 博客
  • 博客访问: 4736987
  • 博文数量: 206
  • 博客积分: 5240
  • 博客等级: 大校
  • 技术积分: 3224
  • 用 户 组: 普通用户
  • 注册时间: 2010-08-12 21:40
文章分类

全部博文(206)

文章存档

2013年(13)

2012年(8)

2011年(33)

2010年(152)

我的朋友

分类: 系统运维

2011-03-20 00:15:12

<html>
<head>
<script type="text/javascript">
function deleteRow(r)
  {
  var i=r.parentNode.parentNode.rowIndex
  document.getElementById('myTable').deleteRow(i)
  }
</script>
</head>
<body>

<table id="myTable" border="1">
<tr>
  <td>Row 1</td>
  <td><input type="button" value="删除" onclick="deleteRow(this)"></td>
</tr>
<tr>
  <td>Row 2</td>
  <td><input type="button" value="删除" onclick="deleteRow(this)"></td>
</tr>
<tr>
  <td>Row 3</td>
  <td><input type="button" value="删除" onclick="deleteRow(this)"></td>
</tr>
</table>

</body>
</html>


如果想要删除某个新添加的文本框,那么又该怎么做呢?

想法是这样的:

在新添加的文本框后,添加一个超级链接“-”,将点击时触发自定义函数deleteRow(this),将当前被点击的对象传入。

function deleteRow(r)

{

var i=r.parentNode.parentNode.rowIndex

document.getElementById('myTable').deleteRow(i)

}

自定义方法在接收到被点击的对象之后,并不能自己删除自己,因为这个deleteRow()方法是对表格元素进行的操作,而不是行。

通过:当前对象.parentNode.parentNode.rowIndex取得了当前行的索引。

解释:当前对象为元素,当前对象.parentNode元素,当前对象.parentNode.parentNode元素。

在获得了希望删除的建造的索引之后,最后再通过DOM获得整个表格元素,然后调用这个表格元素的deleteRow(i),将刚刚得到的那个索引为i的行删除。

阅读(2022) | 评论(0) | 转发(0) |
0

上一篇:JSON

下一篇:javaScript DOM方法与属性摘要

给主人留下些什么吧!~~