JavaScript动态添加删除表格行(支持FireFox)
JavaScript动态添加删除表格行(支持FireFox)
2006-08-16 12:47
效果图如下:
点“添加参与人”按钮可以添加一行,每行后面都有一个删除按钮,可以删除所在行,“清空”则删除所有的行。
这种效果在需要批量添加数据的时候非常有用,可以在客户端添加完一批数据,然后通过AJAX一次提交给服务器处理,下面是完整代码:
Body部份:
<div>
<table width="613" border="0" cellpadding="2" cellspacing="1" id="SignFrame">
<tr id="trHeader">
<td width="27" bgcolor="#96E0E2">序号</td>
<td width="64" bgcolor="#96E0E2">用户姓名</td>
<td width="98" bgcolor="#96E0E2">电子邮箱</td>
<td width="92" bgcolor="#96E0E2">固定电话</td>
<td width="86" bgcolor="#96E0E2">移动手机</td>
<td width="153" bgcolor="#96E0E2">公司名称</td>
<td width="57" align="center" bgcolor="#96E0E2"> </td>
</tr>
</table>
</div>
<div>
<input type="button" name="Submit" value="添加参与人" onclick="AddSignRow()" />
&nbs
相关文档:
自从 Google 推出含 V8 JavaScript 引擎的 Chrome 以来,公众对 JavaScript
引擎执行效率的胃口又一次被提高,众多浏览器的开发者们绞尽脑汁提升他们的 JavaScript 性能,Opera 最新的10.50 版的 Carakan
引擎据称已经超过 V8,而 Firefox 的开发者们也不甘示弱。
最近升级到 Firefox 3.6 的用户已经发现他们的 Java ......
<body oncontextmenu="return false" onselectstart="return false" ondragstart="return false" onbeforecopy="return false" onmouseup=document.selection.empty() oncopy=document.selection.empty() onselect=document.selection.empty()></body>
讲上面红色显示的插入到网页中就可以实现鼠标右击无效
......
一、建立网页
<html>
<head>
<meta http-equiv="Content-Language" content="zh-cn">
<script language="javascript" type="text/javascript">
<!-- 提供给C#程序调用的方法 -->
function messageBox(message)
{
alert(message);
}
</script>
</head>
& ......
删除行
<script>
function del(obj)
{
obj.parentNode.parentNode.removeNode(true);
}
</script>
<body& ......
一。取表格对象
var getTable= document.getElementById("tabHeTong");
二。插入行
var oTR = getTable.insertRow();//新增一行
三。某行加入列
var oTDa = oTR.insertCell();//新增一列
var oTDb = oTR.insertCell();//新增二列
var oTDc = oTR.insertCell();//新增三列
四。删除行:
getTable. ......