//动态合并表格
//传入参数:tableObj(表格ID);
//childNodeIndexs:需要合并的列索引可传多列索引用逗号分割如:(‘0,1,2’表示合并表格的一二三列数据,注意传入索引时必须按照
从前往后的顺序)
function setRowSpan(tableObj,childNodeIndexs){
try{
var childNodeIndex; //定义需要合并的索引数组
//如果传进来的索引不为空就已传进来的索引进行合并,否则就按照表格的第一列进行合并
if(childNodeIndexs!=null){
childNodeIndex=childNodeIndexs.split(",");
}else{
childNodeIndex[0]='0';
}
//得到需要合并的表格对象
var tableObj = document.getElementById(tableObj);
//得到表格的tbody包体对象
var nodes=tableObj.childNodes[1].childNodes;
var objList= new Array() ;
var c = 1;
//对包体中表格的列进行循环
for(var k=0;k<nodes.length;k++){
//得到当前行的值
var curValue=nodes[k].childNodes[parseInt(childNodeIndex[0])].innerHTML;
//定义下一行的值
var nextValue="";
if(nodes[k+1]!=null){
nextValue=nodes[k+1].childNodes[parseInt(childNodeIndex[0])].innerHTML;
}
//如果当前行的值和下一行值相等则把需要合并行的数目加"1",并把下一行的对象放到集合中
if(curValue == nextValue){
objList.push(nodes[k+1].childNodes[parseInt(childNodeIndex[0])]);
c++;
}else{
//如果当前行的值和下一行的值不行等,则从值相等的那一行的td进行行合并rowSpan=c(c:表示判断值
相等的次数默认为1)
for(var i=0;i<childNodeIndex.length;i++){
nodes[k-c+1].childNodes[parseInt(childNodeIndex[i])].rowSpan=c;
}
//循环把合并行的单元格移除,直流最后一行
for(var d=0;d<objList.length;d++){
var pNode=objList[d].parentNode;
//定义移除单元格的次数,母的每移除一个单元格,之前的索引要减去"1"
var index=0;
for(var i=0;i<childNodeIndex.length;i++){
pNode.removeChild(pNode.childNodes[parseInt(childNodeIndex[i]-index)]);
index++;
}
}
//重置变量初始值
c=1;
objList=new Array();
}
}
}catch(e){
return false;
}
}
<script>
//页面加载时,调用公共的js用于表格显示合并相同课程教学班
setRowSpan("row",'0');
</script>
【js】动态合并表格
最新推荐文章于 2023-08-21 17:30:41 发布