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 相关文章推荐
jQuery技巧大放送 学习jquery的朋友可以看下
Oct 14 Javascript
Extjs 继承Ext.data.Store不起作用原因分析及解决
Apr 15 Javascript
JS实现文字放大效果的方法
Mar 03 Javascript
javascript实现点击商品列表checkbox实时统计金额的方法
May 15 Javascript
JavaScript类型系统之正则表达式
Jan 05 Javascript
D3.js实现雷达图的方法详解
Sep 22 Javascript
微信小程序 自定义对话框实例详解
Jan 20 Javascript
jquery 校验中国身份证号码实例详解
Apr 11 jQuery
解决vue 项目引入字体图标报错、不显示等问题
Sep 01 Javascript
JavaScript栈和队列相关操作与实现方法详解
Dec 07 Javascript
kafka调试中遇到Connection to node -1 could not be established. Broker may not be available.
Sep 17 Javascript
微信小程序 scroll-view 水平滚动实现过程解析
Oct 12 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
Php+SqlServer实现分页显示
2006/10/09 PHP
PHP下通过系统信号量加锁方式获取递增序列ID
2009/09/25 PHP
Zend的MVC机制使用分析(一)
2013/05/02 PHP
php中的filesystem文件系统函数介绍及使用示例
2014/02/13 PHP
php相对当前文件include其它文件的方法
2015/03/13 PHP
php如何控制用户对图片的访问 PHP禁止图片盗链
2016/03/25 PHP
php使用正则验证中文
2016/04/06 PHP
JavaScript 对象、函数和继承
2009/07/07 Javascript
WEB 浏览器兼容 推荐收藏
2010/05/14 Javascript
Jquery 自定义动画概述及示例
2013/03/29 Javascript
jQuery之日期选择器的深入解析
2013/06/19 Javascript
JQuery替换DOM节点的方法
2015/06/11 Javascript
探索angularjs+requirejs全面实现按需加载的套路
2016/02/26 Javascript
json对象转为字符串,当做参数传递时加密解密的实现方法
2016/06/29 Javascript
jQuery实现点击表格单元格就可以编辑内容的方法【测试可用】
2016/08/01 Javascript
Node.js 8 中的 util.promisify的详解
2017/06/12 Javascript
Bootstrap treeview实现动态加载数据并添加快捷搜索功能
2018/01/07 Javascript
webuploader分片上传的实现代码(前后端分离)
2018/09/10 Javascript
vue实现计步器功能
2019/11/01 Javascript
微信小程序实现签到弹窗动画
2020/09/21 Javascript
Python实现OpenCV的安装与使用示例
2018/03/30 Python
django实现支付宝支付实例讲解
2019/10/17 Python
Python 实现向word(docx)中输出
2020/02/13 Python
django实现日志按日期分割
2020/05/21 Python
Python urllib3软件包的使用说明
2020/11/18 Python
Python实现简单的2048小游戏
2021/03/01 Python
美国网上购买眼镜:Eyeconic
2017/07/29 全球购物
酒店拾金不昧表扬信
2014/01/18 职场文书
学生社团文化节开幕式主持词
2014/03/28 职场文书
现场活动策划方案
2014/08/22 职场文书
共产党员批评与自我批评
2014/10/15 职场文书
茶楼服务员岗位职责
2015/02/09 职场文书
2015年依法治校工作总结
2015/07/27 职场文书
婚礼迎宾词大全
2015/08/10 职场文书
python实现Thrift服务端的方法
2021/04/20 Python
MongoDB 常用的crud操作语句
2021/06/20 MongoDB