JS 实现Table相同行的单元格自动合并示例代码 

 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
 2 <HTML> 
 3 <HEAD> 
 4 <TITLE> New Document </TITLE> 
 5 <META NAME="Generator" CONTENT="EditPlus"> 
 6 <META NAME="Author" CONTENT=""> 
 7 <META NAME="Keywords" CONTENT=""> 
 8 <META NAME="Description" CONTENT=""> 
 9 </HEAD> 
10 <SCRIPT LANGUAGE="JavaScript"> 
11 function autoRowSpan(tb,row,col) 
12 { 
13 var lastValue=""; 
14 var value=""; 
15 var pos=1; 
16 for(var i=row;i<tb.rows.length;i++){ 
17 value = tb.rows[i].cells[col].innerText; 
18 if(lastValue == value){ 
19 tb.rows[i].deleteCell(col); 
20 tb.rows[i-pos].cells[col].rowSpan = tb.rows[i-pos].cells[col].rowSpan+1; 
21 pos++; 
22 }else{ 
23 lastValue = value; 
24 pos=1; 
25 } 
26 } 
27 } 
28 
29 </SCRIPT> 
30 <BODY onload="autoRowSpan(tb,0,0)"> 
31 <TABLE id="tb" border="1"> 
32 <THEAD> 
33 <TR > 
34 <TD>国家</TD> 
35 <TD>地区</TD> 
36 </TR> 
37 </THEAD> 
38 <TR> 
39 <TD>中国</TD> 
40 <TD>河南</TD> 
41 </TR> 
42 <TR> 
43 <TD>中国</TD> 
44 <TD>四川</TD> 
45 </TR> 
46 <TR> 
47 <TD>中国</TD> 
48 <TD>北京</TD> 
49 </TR> 
50 <TR> 
51 <TD>美国</TD> 
52 <TD>纽约</TD> 
53 </TR> 
54 <TR> 
55 <TD>美国</TD> 
56 <TD>洛杉矶</TD> 
57 </TR> 
58 <TR> 
59 <TD>英国</TD> 
60 <TD>伦敦</TD> 
61 </TR> 
62 </TABLE> 
63 </BODY> 
64 </HTML>

 

posted on 2019-04-28 17:52  江清澜静  阅读(1891)  评论(0)    收藏  举报

导航