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报错 Object doesn't support this property or method的原因分析
Mar 31 Javascript
javascript获取隐藏dom的宽高 具体实现
Jul 14 Javascript
jQuery获取iframe的document对象的方法
Oct 10 Javascript
jQuery中$.click()无效问题分析
Jan 29 Javascript
JavaScript 异常处理 详解
Feb 06 Javascript
js运动应用实例解析
Dec 28 Javascript
jQuery 弹出层插件(推荐)
May 24 Javascript
前端学习笔记style,currentStyle,getComputedStyle的用法与区别
May 28 Javascript
js获取元素的外链样式的简单实现方法
Jun 06 Javascript
ui组件之input多选下拉实现方法(带有搜索功能)
Jul 14 Javascript
微信小程序实现左右联动的实战记录
Jul 05 Javascript
JQuery发送ajax请求时中文乱码问题解决
Nov 14 jQuery
在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
Terran兵种介绍
2020/03/14 星际争霸
php利用事务处理转账问题
2015/04/22 PHP
Yii2中设置与获取别名的函数(setAlias和getAlias)用法分析
2016/07/25 PHP
PHP通过CURL实现定时任务的图片抓取功能示例
2016/10/03 PHP
Laravel配合jwt使用的方法实例
2020/10/25 PHP
jQuery之$(document).ready()使用介绍
2012/04/05 Javascript
超炫的jquery仿flash导航栏特效
2014/11/11 Javascript
js实现禁止中文输入的方法
2015/01/14 Javascript
JQuery显示、隐藏div的几种方法简明总结
2015/04/16 Javascript
使用JQuery在线制作ppt并在线演示源码特效
2015/09/08 Javascript
JS实现DOM删除节点操作示例
2018/04/04 Javascript
vue中在vuex的actions中请求数据实例
2019/11/08 Javascript
[30:00]完美世界DOTA2联赛PWL S2 Rebirth vs LBZS 第二场 11.28
2020/12/01 DOTA
Python批量转换文件编码格式
2015/05/17 Python
Python本地与全局命名空间用法实例
2015/06/16 Python
使用FastCGI部署Python的Django应用的教程
2015/07/22 Python
python3读取MySQL-Front的MYSQL密码
2017/05/03 Python
django开发教程之利用缓存文件进行页面缓存的方法
2017/11/10 Python
Python实现的字典值比较功能示例
2018/01/08 Python
Python性能分析工具Profile使用实例
2019/11/19 Python
python3 动态模块导入与全局变量使用实例
2019/12/22 Python
django queryset相加和筛选教程
2020/05/18 Python
python request 模块详细介绍
2020/11/10 Python
加拿大快时尚零售商:Ardene
2018/02/14 全球购物
字符串str除首尾字符外的其他字符按升序排列
2013/03/08 面试题
什么是重载?CTS、CLS和CLR分别做何解释
2012/05/06 面试题
一套Delphi的笔试题二
2013/05/11 面试题
遗嘱公证书标准样本
2014/04/08 职场文书
《歌唱二小放牛郎》教学反思
2014/04/19 职场文书
岳庙导游词
2015/02/04 职场文书
法定授权委托证明书
2015/06/18 职场文书
2019年大学生学年自我鉴定!
2019/03/25 职场文书
CSS几步实现赛博朋克2077风格视觉效果
2021/06/16 HTML / CSS
python中Matplotlib绘制直线的实例代码
2021/07/04 Python
2007年老电脑安装win11会怎么样? 网友实测win11在老电脑运行良好
2021/11/21 数码科技
Python测试框架pytest高阶用法全面详解
2022/06/01 Python