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 ajax 登录验证实现代码
Sep 23 Javascript
javascript 最常用的10个自定义函数[推荐]
Dec 26 Javascript
jquery实现的让超出显示范围外的导航自动固定屏幕最顶上
Sep 22 Javascript
客户端验证用户名和密码的方法详解
Jun 16 Javascript
jQuery设置聚焦并使光标位置在文字最后的实现方法
Aug 02 Javascript
Ionic默认的Tabs模板使用实例
Aug 29 Javascript
jQuery EasyUI 右键菜单--关闭标签/选项卡的简单实例
Oct 10 Javascript
bootstrap表单按回车会自动刷新页面的解决办法
Mar 08 Javascript
JS异步加载的三种实现方式
Mar 16 Javascript
vue 表单输入格式化中文输入法异常问题
May 30 Javascript
Vue管理系统前端之组件拆分封装详解
Aug 23 Javascript
SSM VUE Axios详解
Oct 05 Vue.js
在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使用curl抓取qq空间的访客信息示例
2014/02/28 PHP
PHP连接MySQL数据的操作要点
2015/03/20 PHP
Laravel框架自定义验证过程实例分析
2019/02/01 PHP
Javascript 获取LI里的内容
2008/12/17 Javascript
IE 条件注释详解总结(附实例代码)
2009/08/29 Javascript
js判断IE6/IE7/FF的代码[XMLHttpRequest]
2011/02/16 Javascript
js中escape对应的C#解码函数 UrlDecode
2012/12/16 Javascript
javascript学习笔记--数字格式类型
2014/05/22 Javascript
点击表单提交时出现jQuery没有权限的解决方法
2014/07/23 Javascript
js实现的捐赠管理完整实例
2015/01/20 Javascript
纯javascript实现自动发送邮件
2015/10/21 Javascript
jQuery拖拽通过八个点改变div大小
2020/11/29 Javascript
vue项目实现记住密码到cookie功能示例(附源码)
2018/01/31 Javascript
jQuery实现鼠标移入移出事件切换功能示例
2018/09/06 jQuery
socket io与vue-cli的结合使用的示例代码
2018/11/01 Javascript
Vue项目引发的「过滤器」使用教程
2019/03/12 Javascript
JavaScript实现栈结构Stack过程详解
2020/03/07 Javascript
Ant Design的Table组件去除
2020/10/24 Javascript
vue打开其他项目页面并传入数据详解
2020/11/25 Vue.js
[10:39]DOTA2上海特级锦标赛音乐会纪录片
2016/03/21 DOTA
[57:24]LGD vs VGJ.T 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
python模拟登录并且保持cookie的方法详解
2017/04/04 Python
Python编程实现微信企业号文本消息推送功能示例
2017/08/21 Python
使用TensorFlow实现二分类的方法示例
2019/02/05 Python
六行python代码的爱心曲线详解
2019/05/17 Python
python wxpython 实现界面跳转功能
2019/12/17 Python
matlab中imadjust函数的作用及应用举例
2020/02/27 Python
Python3+Appium安装及Appium模拟微信登录方法详解
2021/02/16 Python
Stylenanda中文站:韩国一线网络服装品牌
2016/12/22 全球购物
医学生自我评价
2014/01/27 职场文书
商场消防演习方案
2014/02/12 职场文书
2014年数学教研组工作总结
2014/12/06 职场文书
资料员岗位职责范本
2015/04/13 职场文书
联谊活动总结范文
2015/05/09 职场文书
2015年毕业实习工作总结
2015/05/29 职场文书
React实现动效弹窗组件
2021/06/21 Javascript