<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script>
//给table增加一行
function addTableRow() {
var table1 = document.getElementById('table1');
var cloneTab = document.getElementById('table2');
//alert(cloneTab.firstChild.firstChild.innerHTML);
//alert(cloneTab.firstChild.firstChild.cloneNode(true).innerHTML);
table1.firstChild.appendChild(cloneTab.firstChild.firstChild.cloneNode(true));
var v= table1.firstChild.childNodes;
var len = v.length;
for(var i=1;i<len;i++){
v[i].childNodes[0].firstChild.id=i;//给第一个单元格id赋值
}
}
//给table删除一行
function delTableRow(){
var table1 = document.getElementById('table1');
var isChecked = document.getElementsByName('isChecked');
var len = isChecked.length;
for(var i=len-1;i>=0;i--){
if(isChecked[i].checked==true){
table1.firstChild.removeChild(isChecked[i].parentNode.parentNode);
//alert(isChecked[i].id);
//alert(isChecked[i].parentNode.parentNode.innerHTML);
}
}
}
</script>
</head>
<body>
<div>
<div style="float: left; WIDTH: 99%; position: relative;">
<table id="table1" width="99%" cellspacing="1" cellpadding="1" border="0" bgcolor="#336699" align="left" style="margin-top:10px;">
<tr bgcolor="#6699CC" align="center"
style="font-weight: bold;">
<td class="pt12-wh" width="10%" height="25">
选择
</td>
<td class="pt12-wh" width="15%" height="25">
检测
</td>
<td class="pt12-wh" width="15%" height="25">
容限/范围
</td>
<td class="pt12-wh" width="20%" height="25">
检测方法
</td>
<td class="pt12-wh" width="20%" height="25">
检查部门
</td>
<td class="pt12-wh" width="10%" height="25">
频率
</td>
<td class="pt12-wh" width="10%" height="25">
结果
</td>
</tr>
</table>
</div>
</div>
<!--控制table的按钮-->
<div style="width: 99%; text-align: right; margin-top: 10px; margin-bottom: 2px; float: left">
<input type="button" value="增加" onclick= "addTableRow();"/>
<input type="button" value="删除" onclick="delTableRow();"/>
<!--模板table也叫做clone table style = "display:none"-->
<table id='table2' style="display: none">
<tr>
<th bgcolor="white" class="pt12-black" align="center"><input type="checkbox" name="isChecked" /><input type="hidden" size="6" value=""/></th>
<th nowrap="nowrap" bgcolor="white" class="pt12-black" align="center"><input name="detection" type="text" /></th>
<th nowrap="nowrap" bgcolor="white" class="pt12-black" align="center"><input name="scope" type="text" /></th>
<th nowrap="nowrap" bgcolor="white" class="pt12-black" align="center"><input name="detectmethod" type="text" /></th>
<th nowrap="nowrap" bgcolor="white" class="pt12-black" align="center"><input name="inspectiondepart" type="text" /></th>
<th nowrap="nowrap" bgcolor="white" class="pt12-black" align="center"><input name="rate" type="text" size="10"/></th>
<th nowrap="nowrap" bgcolor="white" class="pt12-black" align="center"><select size="1" id="inspectresult" name="inspectresult">
<option value="合格">合格</option>
<option value="不合格">不合格</option>
</select></th>
</tr>
</table>
</div>
</body>
</html>
详细解决方案
脚本给TABLE 平添 删除 行的操作DEMO
热度:429 发布时间:2012-11-09 10:18:48.0
相关解决方案
- jsp页面中加了<table>元素后,页面出现了一大片空白后才出现表格?解决方法
- jsp页面中加了<table>元素后,页面出现了一大片空缺后才出现表格
- Unknown table 'book' in field list
- 求DEV的XAF框架-课程 DEMO 资料 (懂DEV的XAF框架的人都来看看)
- 求DEV的XAF构架-教程 DEMO 资料 (懂DEV的XAF框架的人都来看看)
- VS2010 RDLC 报表 表(table) 分页的时候怎么显示表头
- 怎么修改localhost:45865/demo.aspx这类网站使用的asp.net版本
- Table 布局怎么改用CSS定位
- sql清空表数据用truncate table 表名处理,若表名是以数字开头,或者完全是数字,这句会报语法异常
- jquery easyui demo 在vs中运行异常-缺少对象
- sqltxet能不能这么写成"select *rowid from table"
- 大哥们救上命啊ArgumentException: 列“xxx”不属于表 Table
- 要取TextBox里的值插入表, insert into table value(); 括号里应该如何写
- 在类名上这样写是啥[Table(Name = "Product")]解决方法
- html中<table>和<asp:Tabel>有什么不一样啊该如何解决
- 求RSS Demo,该怎么解决
- JS预览 Table
- 怎么自动补充html中<table>中的宽度和高度
- 关于<table class="Text">
- web.config 中能否配置多个登录窗体?<forms name="demo" loginUrl="/login.aspx" timeout="60" />解决方案
- 如何能不让GridView变成<table>
- HTML用在<table>上的cellpadding、cellspacing在css里对应的是什么解决方案
- 元素"tr"不能嵌套在元素"table"中,该怎么处理
- ◆◇◆ 帮小弟我将 table 转成 div 。◆◇◆
- |M| 今天看了孟子E章的设置 table 中的cellSpacing="0" cellPadding="0" 可以但有点不理解,麻烦大家说明一下,该如何解决
- Column "xxx" does not belong to table Table,该怎么解决
- ALTER TABLE pet_type ADD CONSTRAINT pet_type_pk PRIMARY KEY (id),该怎么解决
- CREATE TABLE EMP(职员信息表)在SQL中如何排序
- ALTER TABLE pet_type ADD CONSTRAINT pet_type_pk PRIMARY KEY (id)解决方案
- Sqlite database table is locked解决方法