js控制table合并具体实现
js控制table合并具体实现
发布时间:2016-12-30 来源:查字典编辑
摘要:复制代码代码如下:无标题文档张三男22数学90张三男22数学90张三女22语文70张三女22英语60李四女22数学60李四女19语文60王五...

复制代码 代码如下:

<!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=gbk" />

<title>无标题文档 </title>

</head>

<body>

<table width="100%" border="1" cellspacing="0" cellpadding="0" id="tab">

<tr>

<td rowspan="0">张三 </td>

<td>男 </td>

<td>22 </td>

<td>数学 </td>

<td>90 </td>

</tr>

<tr>

<td rowspan="0">张三 </td>

<td>男 </td>

<td>22 </td>

<td>数学 </td>

<td>90 </td>

</tr>

<tr>

<td rowspan="0">张三 </td>

<td>女 </td>

<td>22 </td>

<td>语文 </td>

<td>70 </td>

</tr>

<tr>

<td rowspan="0">张三 </td>

<td>女 </td>

<td>22 </td>

<td>英语 </td>

<td>60 </td>

</tr>

<tr>

<td rowspan="0">李四 </td>

<td>女 </td>

<td>22 </td>

<td>数学 </td>

<td>60 </td>

</tr>

<tr>

<td rowspan="0">李四 </td>

<td>女 </td>

<td>19 </td>

<td>语文 </td>

<td>60 </td>

</tr>

<tr>

<td rowspan="0">王五 </td>

<td>男 </td>

<td>19 </td>

<td>英语 </td>

<td>60 </td>

</tr>

</table>

<script type="text/javascript">

window.onload = function(){

var tab = document.getElementById("tab");

var col =0;

megercell(tab, col);

megercell1(tab, col+1);

for(var i=0; i<tab.rows.length; i++){

// alert(tab.rows[i].cells[0].getAttribute("rowspan"));

}

};

function megercell(tab, col){

count = 1;

val = "";

for(var i=0; i<tab.rows.length; i++){

if(val == tab.rows[i].cells[col].innerHTML){

count++;

}else{

if(count > 1){

from = i - count;

tab.rows[from].cells[col].rowSpan = count;

for(var j=from+1; j<i; j++){

tab.rows[j].cells[col].style.display = "none";

}

count = 1;

}

val = tab.rows[i].cells[col].innerHTML;

}

}

}

function megercell1(tab, col){

count = 1;

val = "";

var rowspan = 0;

for(var i=0; i<tab.rows.length;){

rowspan = parseInt(tab.rows[i].cells[0].getAttribute("rowspan"));

if(rowspan)

{

for(var n = 0; n < rowspan; n++)

{

if(val == tab.rows[i].cells[col].innerHTML){

count++;

}else{

if(count > 1){

from = i - count;

tab.rows[from].cells[col].rowSpan = count;

for(var j=from+1; j<i; j++){

tab.rows[j].cells[col].style.display = "none";

}

count = 1;

}

val = tab.rows[i].cells[col].innerHTML;

}

i++;

}

if(count> 1)

{

from = i - count;

alert(from +" "+ i +" "+ count);

tab.rows[from].cells[col].rowSpan = count;

for(var j=from+1; j<i; j++){

tab.rows[j].cells[col].style.display = "none";

}

}

count = 1;

val = "";

}

else

{

i++;

}

}

}

</script>

</body>

</html>

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类