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


Posted in Javascript onApril 02, 2007

<!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=" "; 

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> </td>
<td><input type="text" name="textfield"></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</form>
</body>
</html>

Javascript 相关文章推荐
JS中的构造函数详细解析
Mar 10 Javascript
使用ajax+jqtransform实现动态加载select
Dec 01 Javascript
Angularjs注入拦截器实现Loading效果
Dec 28 Javascript
浅谈javascript基础之客户端事件驱动
Jun 10 Javascript
基于Bootstrap的后台管理面板 Bootstrap Metro Dashboard
Jun 17 Javascript
jQuery动态添加与删除tr行实例代码
Oct 18 Javascript
原生JS京东轮播图代码
Mar 22 Javascript
微信小程序 按钮滑动的实现方法
Sep 27 Javascript
node.js ws模块搭建websocket服务端的方法示例
Apr 25 Javascript
JavaScript实现矩形块大小任意缩放
Aug 25 Javascript
浅谈JavaScript浅拷贝和深拷贝
Nov 07 Javascript
Moment的feature导致线上bug解决分析
Sep 23 Javascript
在IE中调用javascript打开Excel的代码(downmoon原作)
Apr 02 #Javascript
在你的网页中嵌入外部网页的方法
Apr 02 #Javascript
关于文本限制字数的js代码
Apr 02 #Javascript
屏蔽鼠标右键、Ctrl+n、shift+F10、F5刷新、退格键 的javascript代码
Apr 01 #Javascript
Javascript中的常见排序算法
Mar 27 #Javascript
一段多浏览器的&quot;复制到剪贴板&quot;javascript代码
Mar 27 #Javascript
CSDN轮换广告图片轮换效果
Mar 27 #Javascript
You might like
eWebEditor v3.8 商业完整版 (PHP)
2006/12/06 PHP
收藏的一个php小偷的核心程序
2007/04/09 PHP
PHP jQuery表单,带验证具体实现方法
2014/02/15 PHP
JavaScript 滚轮事件使用说明
2010/03/07 Javascript
不同Jquery版本引发的问题解决
2013/10/14 Javascript
在javascript中实现函数数组的方法
2013/12/25 Javascript
如何获取网站icon有哪些可行的方法
2014/06/05 Javascript
jQuery检查事件是否触发的方法
2015/06/26 Javascript
jQuery实现Email邮箱地址自动补全功能代码
2015/11/03 Javascript
Javascript获取随机数的实现方法
2016/06/22 Javascript
NodeJs下的测试框架Mocha的简单介绍
2017/02/22 NodeJs
jQuery Validate格式验证功能实例代码(包括重名验证)
2017/07/18 jQuery
vue2中引用及使用 better-scroll的方法详解
2018/11/15 Javascript
node.js实现为PDF添加水印的示例代码
2018/12/05 Javascript
[42:32]Secret vs Optic 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
Python二维码生成库qrcode安装和使用示例
2014/12/16 Python
在Python的web框架中中编写日志列表的教程
2015/04/30 Python
Python根据区号生成手机号码的方法
2015/07/08 Python
利用python代码写的12306订票代码
2015/12/20 Python
浅谈python jieba分词模块的基本用法
2017/11/09 Python
python+matplotlib绘制简单的海豚(顶点和节点的操作)
2018/01/02 Python
python用for循环求和的方法总结
2019/07/08 Python
Python 继承,重写,super()调用父类方法操作示例
2019/09/29 Python
使用Python实现微信拍一拍功能的思路代码
2020/07/09 Python
贝嫂喜欢的婴儿品牌,个性化的婴儿礼物:My 1st Years
2017/11/19 全球购物
英国最大的自有市场,比亚马逊便宜:Flubit
2019/03/19 全球购物
意大利奢侈品牌在线精品店:Jole.it
2020/11/23 全球购物
护士自我鉴定
2013/10/23 职场文书
结婚喜宴家长答谢词
2014/01/15 职场文书
法学个人求职信范文
2014/01/27 职场文书
优秀应届毕业生推荐信
2014/02/18 职场文书
医学专业毕业生求职信
2014/06/20 职场文书
财务人员岗位职责
2015/02/03 职场文书
nginx网站服务如何配置防盗链(推荐)
2021/03/31 Servers
mysql如何查询连续记录
2022/05/11 MySQL
go goth封装第三方认证库示例详解
2022/08/14 Golang