<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script src="jquery-1.4.4.min.js" type="text/javascript"></script>
<script language="javascript">
function addRows(){
var rows=$("#table");
var vNum=$("#table tr").filter(".rows").size()+1;
//alert(vNum);
var vTr=$("#table #tr4");
//alert(vTr);
var tClone=vTr.clone(true);
//alert(tClone[0]);
tClone[0].id="tr"+vNum;
//rows.insertBefore(tClone,$("#tr5"));
tClone.appendTo(rows).insertAfter($("#tr4"));
}
function addLBrows(){
var rows=$("#table");
var vNum=$("#table tr").filter(".rows2").size()+1;
/*$("#tr3_1").removeAttr("rowspan");
$("#tr3_1").attr("rowspan",++vNum);
var addRow=document.getElementById("tr3_1").getAttribute("rowspan")
alert(addRow);
document.getElementById("tr3_1").setAttribute("rowspan",parseInt(addRow)+(vNum++)-1);*/
var vTr=$("#table #tr3_2");
var tClone=vTr.clone(true);
tClone[0].id="tr3_"+vNum-1;
tClone.appendTo(rows).insertAfter($("#tr3_2"));
$("#tr3_1").css("rowspan",++vNum); }
function addLB(){
}
function cStyle(id){
var tr2=$("#tr2_1");
tr2.style.rowspan=""+id;
}
</script>
</head><body>
<div>
<table width="1024" border="1" id="table">
<tr valign="top" class="rows" id="tr1">
<td width="43" rowspan="3" align="center" valign="middle"><p>单</p>
<p>位</p></td>
<td width="58" rowspan="3" align="center" valign="top"><p>小</p>
<p>计</p></td>
<td colspan="6" align="center" valign="top">完好车</td>
<td colspan="11" align="center" valign="top">非完好车</td>
</tr>
<tr >
<td colspan="3" rowspan="2" align="center">封存车</td>
<td width="25" rowspan="2" align="center">执勤</td>
<td width="29" rowspan="2" align="center">待命</td>
<td width="30" rowspan="2" align="center">日保养</td>
<td width="27" rowspan="2" align="center">待料</td>
<td width="28" rowspan="2" align="center">待报废</td>
<td colspan="3" align="center">再修</td>
<td colspan="3" align="center">待修</td>
<td colspan="3" align="center">保养</td>
</tr>
<tr >
<td width="41" align="center" valign="top">大</td>
<td width="39" align="center" valign="top">中</td>
<td width="40" align="center" valign="top">小</td>
<td width="40" align="center" valign="top">大</td>
<td width="42" align="center" valign="top">中</td>
<td width="38" align="center" valign="top">小</td>
<td width="40" align="center" valign="top">大</td>
<td width="35" align="center" valign="top">中</td>
<td width="43" align="center" valign="middle">小</td>
</tr>
<tr class="rows" id="tr2" class="rows2">
<td id="tr2_1" rowspan="2" align="center" valign="middle"><p>类</p>
<p>别</p></td>
<td height="30" align="center" valign="top"> </td>
<td width="120" align="center" valign="top"> </td>
<td width="93" align="center" valign="top"> </td>
<td width="95" align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="middle"> </td>
</tr>
<tr id="tr2_2" class="rows2">
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="middle"> </td>
</tr>
<tr class="rows" id="tr3">
<td id="tr3_1" rowspan="2" align="center" valign="middle"><p>类</p>
<p>别</p></td>
<td height="32" align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="middle"> </td>
</tr>
<tr id="tr3_2">
<td height="24" align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
</tr>
<tr class="rows" id="tr4">
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr class="rows" id="tr5">
<td>合计</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</div>
<center>
<form action="#" method="post">
<input type="button" id="LB1" value="添加类别行" onclick="addLBrows()"/>
<input type="button" value="添加单行" onclick="addRows()"/>
</form>
<center>
</body>
</html>
我要点击添加类别行后类别的行两行变成三行
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script src="jquery-1.4.4.min.js" type="text/javascript"></script>
<script language="javascript">
function addRows(){
var rows=$("#table");
var vNum=$("#table tr").filter(".rows").size()+1;
//alert(vNum);
var vTr=$("#table #tr4");
//alert(vTr);
var tClone=vTr.clone(true);
//alert(tClone[0]);
tClone[0].id="tr"+vNum;
//rows.insertBefore(tClone,$("#tr5"));
tClone.appendTo(rows).insertAfter($("#tr4"));
}
function addLBrows(){
var rows=$("#table");
var vNum=$("#table tr").filter(".rows2").size()+1;
/*$("#tr3_1").removeAttr("rowspan");
$("#tr3_1").attr("rowspan",++vNum);
var addRow=document.getElementById("tr3_1").getAttribute("rowspan")
alert(addRow);
document.getElementById("tr3_1").setAttribute("rowspan",parseInt(addRow)+(vNum++)-1);*/
var vTr=$("#table #tr3_2");
var tClone=vTr.clone(true);
tClone[0].id="tr3_"+vNum-1;
tClone.appendTo(rows).insertAfter($("#tr3_2"));
$("#tr3_1").css("rowspan",++vNum); }
function addLB(){
}
function cStyle(id){
var tr2=$("#tr2_1");
tr2.style.rowspan=""+id;
}
</script>
</head><body>
<div>
<table width="1024" border="1" id="table">
<tr valign="top" class="rows" id="tr1">
<td width="43" rowspan="3" align="center" valign="middle"><p>单</p>
<p>位</p></td>
<td width="58" rowspan="3" align="center" valign="top"><p>小</p>
<p>计</p></td>
<td colspan="6" align="center" valign="top">完好车</td>
<td colspan="11" align="center" valign="top">非完好车</td>
</tr>
<tr >
<td colspan="3" rowspan="2" align="center">封存车</td>
<td width="25" rowspan="2" align="center">执勤</td>
<td width="29" rowspan="2" align="center">待命</td>
<td width="30" rowspan="2" align="center">日保养</td>
<td width="27" rowspan="2" align="center">待料</td>
<td width="28" rowspan="2" align="center">待报废</td>
<td colspan="3" align="center">再修</td>
<td colspan="3" align="center">待修</td>
<td colspan="3" align="center">保养</td>
</tr>
<tr >
<td width="41" align="center" valign="top">大</td>
<td width="39" align="center" valign="top">中</td>
<td width="40" align="center" valign="top">小</td>
<td width="40" align="center" valign="top">大</td>
<td width="42" align="center" valign="top">中</td>
<td width="38" align="center" valign="top">小</td>
<td width="40" align="center" valign="top">大</td>
<td width="35" align="center" valign="top">中</td>
<td width="43" align="center" valign="middle">小</td>
</tr>
<tr class="rows" id="tr2" class="rows2">
<td id="tr2_1" rowspan="2" align="center" valign="middle"><p>类</p>
<p>别</p></td>
<td height="30" align="center" valign="top"> </td>
<td width="120" align="center" valign="top"> </td>
<td width="93" align="center" valign="top"> </td>
<td width="95" align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="middle"> </td>
</tr>
<tr id="tr2_2" class="rows2">
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="middle"> </td>
</tr>
<tr class="rows" id="tr3">
<td id="tr3_1" rowspan="2" align="center" valign="middle"><p>类</p>
<p>别</p></td>
<td height="32" align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="top"> </td>
<td align="center" valign="middle"> </td>
</tr>
<tr id="tr3_2">
<td height="24" align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
</tr>
<tr class="rows" id="tr4">
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr class="rows" id="tr5">
<td>合计</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</div>
<center>
<form action="#" method="post">
<input type="button" id="LB1" value="添加类别行" onclick="addLBrows()"/>
<input type="button" value="添加单行" onclick="addRows()"/>
</form>
<center>
</body>
</html>
我要点击添加类别行后类别的行两行变成三行
解决方案 »
- ext3.2 如何让横轴文本竖直方向显示
- 求JS高手写JS滑动
- www.qincai.net这个网站防止图片被采集,怎么做到的呢?
- 这段js代码在FF下怎么不行啊?
- javascript高手进
- 请教JQUEYR AJAX
- 各位大虾,我遇到一个js层的问题,希望今晚能解决(太急了,谢谢各位)在线等待
- 格式化一个数值数据保留两位小数的函数有吗?
- 怎样设定才能使body上下不能scroll,而左右方向上能scroll?
- jsp中两个框中内容互换可以添加也可以移除 经过添加移除项提交后通过request.getParameterValues取不到最新数据
- ECSHOP的clothing模版中关于"放入购物车"的代码问题!
- 如何用jquery实现当鼠标移出层时层消失
var newTr = $("#tr3").clone().insertAfter($("#tr3_2"));
$("#tr3_2").clone().insertAfter(newTr);
}