<!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=UTF-8" /> |
<title>合并单元格(列)</title> |
<style type= "text/css" > |
td{ |
font-size: 12px; |
background-color: #D4D4D4; |
border: 1px solid #9AC0CD; |
} |
</style> |
<script src= "jquery.js" ></script> |
<script type= "text/javascript" > |
$(document).ready( function (){ |
_w_table_lefttitle_rowspan( "#rspan" ,0,0); |
}) |
</script> |
<script language= "javascript" > |
function _w_table_lefttitle_rowspan(_w_table_id, _w_table_mincolnum, |
_w_table_maxcolnum) { |
if (_w_table_mincolnum == void 0) { |
_w_table_mincolnum = 1; |
} |
if (_w_table_maxcolnum == void 0) { |
_w_table_maxcolnum = _w_table_mincolnum; |
} |
if (_w_table_mincolnum > _w_table_maxcolnum) { |
return "" ; |
} else { |
var _w_table_splitrow = new Array(); |
_w_table_onerowspan(1); // 只合并第一列 |
/* |
* for(iLoop=1;iLoop<=2;iLoop++){//合并前两列 _w_table_onerowspan(iLoop); } |
*/ |
} |
function _w_table_onerowspan(_w_table_colnum) { |
_w_table_firstrow = 0; |
_w_table_SpanNum = 0; |
_w_table_splitNum = 0; |
_w_table_Obj = $(_w_table_id + " tr td:nth-child(" + _w_table_colnum |
+ ")" ); |
_w_table_curcol_rownum = _w_table_Obj.length - 1; |
if (_w_table_splitrow.length == 0) { |
_w_table_splitrow[0] = _w_table_curcol_rownum; |
} |
_w_table_lastrow = _w_table_splitrow[0]; |
var _w_table_firsttd; |
var _w_table_currenttd; |
var _w_table_curcol_splitrow = new Array(); |
_w_table_Obj.each( function (i) { |
if (i == _w_table_firstrow) { |
_w_table_firsttd = $( this ); |
_w_table_SpanNum = 1; |
} else { |
_w_table_currenttd = $( this ); |
if (_w_table_firsttd.text() == _w_table_currenttd.text()) { |
_w_table_SpanNum++; |
_w_table_currenttd.hide(); // remove(); |
_w_table_firsttd.attr( "rowSpan" , _w_table_SpanNum); |
} else { |
_w_table_firsttd = $( this ); |
_w_table_SpanNum = 1; |
setTableRow(i - 1); |
} |
if (i == _w_table_lastrow) { |
setTableRow(i); |
} |
} |
function setTableRow(_splitrownum) { |
if (_w_table_lastrow <= _splitrownum |
&& _w_table_splitNum++ < _w_table_splitrow.length) { |
_w_table_lastrow = _w_table_splitrow[_w_table_splitNum]; |
} |
_w_table_curcol_splitrow[_w_table_curcol_splitrow.length] = _splitrownum; |
if (i < _w_table_curcol_rownum) { |
_w_table_firstrow = _splitrownum + 1; |
} |
} |
}) ; |
_w_table_splitrow = _w_table_curcol_splitrow; |
} |
} |
</script> |
</head> |
<body> |
<table width= "500" height= "350" border= "0" cellpadding= "0" |
cellspacing= "0" id= "rspan" > |
<tr> |
<td><div align= "center" >A</div></td> |
<td><div align= "center" >Q</div></td> |
<td><div align= "center" >J</div></td> |
<td><div align= "center" >T</div></td> |
<td><div align= "center" >P</div></td> |
<td><div align= "center" >Z</div></td> |
<td><div align= "center" >F</div></td> |
</tr> |
<tr> |
<td><div align= "center" >A</div></td> |
<td><div align= "center" >W</div></td> |
<td><div align= "center" >J</div></td> |
<td><div align= "center" >Y</div></td> |
<td><div align= "center" >O</div></td> |
<td><div align= "center" >X</div></td> |
<td><div align= "center" >G</div></td> |
</tr> |
<tr> |
<td><div align= "center" >B</div></td> |
<td><div align= "center" >W</div></td> |
<td><div align= "center" >J</div></td> |
<td><div align= "center" >Y</div></td> |
<td><div align= "center" >P</div></td> |
<td><div align= "center" >Z</div></td> |
<td><div align= "center" >H</div></td> |
</tr> |
<tr> |
<td><div align= "center" >C</div></td> |
<td><div align= "center" >W</div></td> |
<td><div align= "center" >K</div></td> |
<td><div align= "center" >T</div></td> |
<td><div align= "center" >I</div></td> |
<td><div align= "center" >Z</div></td> |
<td><div align= "center" >H</div></td> |
</tr> |
<tr> |
<td><div align= "center" >C</div></td> |
<td><div align= "center" >E</div></td> |
<td><div align= "center" >L</div></td> |
<td><div align= "center" >T</div></td> |
<td><div align= "center" >I</div></td> |
<td><div align= "center" >X</div></td> |
<td><div align= "center" >G</div></td> |
</tr> |
<tr> |
<td><div align= "center" >C</div></td> |
<td><div align= "center" >E</div></td> |
<td><div align= "center" >J</div></td> |
<td><div align= "center" >U</div></td> |
<td><div align= "center" >I</div></td> |
<td><div align= "center" >C</div></td> |
<td><div align= "center" >F</div></td> |
</tr> |
<tr> |
<td><div align= "center" >D</div></td> |
<td><div align= "center" >Q</div></td> |
<td><div align= "center" >L</div></td> |
<td><div align= "center" >U</div></td> |
<td><div align= "center" >P</div></td> |
<td><div align= "center" >C</div></td> |
<td><div align= "center" >G</div></td> |
</tr> |
<tr> |
<td><div align= "center" >E</div></td> |
<td><div align= "center" >E</div></td> |
<td><div align= "center" >L</div></td> |
<td><div align= "center" >U</div></td> |
<td><div align= "center" >O</div></td> |
<td><div align= "center" >X</div></td> |
<td><div align= "center" >G</div></td> |
</tr> |
<tr> |
<td><div align= "center" >E</div></td> |
<td><div align= "center" >W</div></td> |
<td><div align= "center" >K</div></td> |
<td><div align= "center" >Y</div></td> |
<td><div align= "center" >O</div></td> |
<td><div align= "center" >C</div></td> |
<td><div align= "center" >H</div></td> |
</tr> |
<tr> |
<td><div align= "center" >E</div></td> |
<td><div align= "center" >W</div></td> |
<td><div align= "center" >K</div></td> |
<td><div align= "center" >T</div></td> |
<td><div align= "center" >P</div></td> |
<td><div align= "center" >X</div></td> |
<td><div align= "center" >F</div></td> |
</tr> |
</table> |
</body> |
</html> |