动态增加删除表格行(兼容IE/FF)

原创 2006年06月13日 17:29:00

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>动态增删表格行</title>
<script language="JavaScript">
<!--
//author: Robin
//email: griefforyou@gmail.com

var rowIndex=0;
function addLine(obj){
var objSourceRow=obj.parentNode.parentNode;
var objTable=obj.parentNode.parentNode.parentNode.parentNode;
if(obj.value=='增加'){
rowIndex++;
var objRow=objTable.insertRow(rowIndex);
var objCell;

objCell=objRow.insertCell(0);
objCell.innerHTML="&nbsp;";

objCell=objRow.insertCell(1);
objCell.innerHTML=objSourceRow.cells[1].innerHTML;

objCell=objRow.insertCell(2);
objCell.innerHTML=objSourceRow.cells[2].innerHTML.replace(/增加/,'删除');
}
else{
objTable.lastChild.removeChild(objSourceRow);
rowIndex--;
}
}

function removeLine(){

}

//-->
</script>
</head>
<body bgcolor="#ffffff">
<form name="form1" method="post">
<table width="400" border="0">
<tr>
<td>基本信息</td>
<td><select name="select">
<option value="" selected>选择</option>
<option value="1">第一</option>
<option value="2">第二</option>
</select></td>
<td><input name="basicinfo" type="text" id="basicinfo">
<input name="add" type="button" id="add" value="增加" onClick="addLine(this)"></td>
</tr>
<tr>
<td>其它信息</td>
<td>&nbsp;</td>
<td><input type="text" name="textfield"></td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
</form>
</body>
</html>

javascript实现动态增加删除表格行(兼容IE/FF)

表格删除行的方法:TableID.deleteRow(TableID.rows.length-1);//删除行的函数http://www.w3.org/TR/html4/loose.dtd"> 动...
  • educast
  • educast
  • 2008年09月07日 16:56
  • 415

动态增加删除表格行(兼容IE/FF)

动态增删表格行//author: Robin//email: griefforyou@gmail.comvar rowIndex=0;function addLine(obj){var objSour...
  • mienimaer
  • mienimaer
  • 2007年01月14日 19:07
  • 458

动态增加删除表格行(兼容IE/FF)

动态增删表格行//author: Robin//email: binluo@expervision.com.cnvar rowIndex=0;function addLine(obj){var obj...
  • JOHNCOOLS
  • JOHNCOOLS
  • 2006年06月30日 11:34
  • 878

jQuery实现表格行的动态增加与删除(改进版)

http://www.blogjava.net/absolutedo/archive/2009/03/13/259488.html
  • huangxiaoya1993
  • huangxiaoya1993
  • 2014年07月30日 15:24
  • 995

JavaScript动态添加/删除表格行

使用原生JavaScript来解决简单的table行动态增删问题
  • sqq0103
  • sqq0103
  • 2016年12月16日 22:23
  • 1273

Table动态增加删除行

关于table表格行的动态操作。
  • liu1765686161
  • liu1765686161
  • 2015年06月10日 08:58
  • 1234

jQuery表格操作添加行、删除行和动态移动

源码:添加jquery1.3.2.js既可以使用http://download.csdn.net/detail/mini_jike/9477374(脚本下载地址) html> html lang="...
  • mini_jike
  • mini_jike
  • 2016年03月31日 00:03
  • 1282

动态添加删除table页面一行input表格

之前写过两篇关于HTML页面添加结点,删除结点的博文。今天偶然看到一个网友询问JSP页面上动态给表格增加行,删除行,碰巧那会儿比较闲,就动手写了一下,记录下来,希望能帮到需要的朋友们。 上面的代码中...
  • magi1201
  • magi1201
  • 2015年04月15日 23:06
  • 11085

动态增加删除表格行

动态增删表格行 //author: Robin //email: binluo@expervision.com.cn var rowIndex=0; function addLine(...
  • simengsiyu
  • simengsiyu
  • 2013年10月18日 16:12
  • 356

jquery实现动态添加和删除表格

无标题文档 $(document).ready(function (){ $("#submit").click(function (){ //先获取文本框的值 var $name=...
  • HUMHSX
  • HUMHSX
  • 2012年03月22日 21:07
  • 5584
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:动态增加删除表格行(兼容IE/FF)
举报原因:
原因补充:

(最多只允许输入30个字)