一定要注意如果从list的开始元素循环下去
remove掉一个元素后
有些元素就找不到了或者说不是要找的那个元素
感兴趣的各位可以研究下哈
代码
复制代码 代码如下:
<!DOCTYPE html>
<html>
<head>
<title>merge
html</title>
<meta http
equiv="keywords" content="keyword
keyword
keyword
">
<meta http
equiv="description" content="this is my page">
<meta http
equiv="content
type" content="text/html; charset=UTF
">
<link rel="stylesheet" href="css/jquery
ui
css" />
<script src="js/jquery
js"></script>
<script src="js/jquery
ui
js"></script>
<script type="text/javascript">
function merge
(){ //可实现单元格
通过给 开始cell的比较
var totalRow = $("#tbl")
find("tr")
length;
var totalCol = $("#tbl")
find("tr")
eq(
)
find("td")
length;
for(var col=totalCol
;col>=
;col
){
spanNum =
;
startCell = $("#tbl")
find("tr")
eq(totalRow
)
find("td")
eq(col);
for(var row = totalRow
;row>=
;row
){
targetCell = $("#tbl")
find("tr")
eq(row
)
find("td")
eq(col);
if(startCell
text() == targetCell
text() && startCell
text()!=""){
spanNum++;
targetCell
attr("rowSpan"
spanNum);
startCell
remove();
}else{
spanNum =
;
}
startCell = targetCell;
}
}
}
function merge
() { //可实现合并单元格
上下行来比较
var totalCols = $("#tbl")
find("tr:eq(
)")
find("td")
length;
var totalRows = $("#tbl")
find("tr")
length;
for ( var i = totalCols
; i >=
; i
) {
for ( var j = totalRows
; j >=
; j
) {
startCell = $("#tbl")
find("tr")
eq(j)
find("td")
eq(i);
targetCell = $("#tbl")
find("tr")
eq(j
)
find("td")
eq(i);
if (startCell
text() == targetCell
text() && targetCell
text() != "") {
targetCell
attr("rowSpan"
(startCell
attr("rowSpan")==undefined)?
:(eval(startCell
attr("rowSpan"))+
));
startCell
remove();
}
}
}
}
/*先合并
使用style 的display:none将相同元素隐藏
然后再remove
*/
function merge
(){
var totalCols = $("#tbl")
find("tr:eq(
)")
find("td")
length;
var totalRows = $("#tbl")
find("tr")
length;
for(var col=totalCols
;col>=
;col
){
spanNum =
;
startCell = $("#tbl")
find("tr")
eq(totalRows
)
find("td")
eq(col);
for(var row = totalRows
;row>=
;row
){
targetCell = $("#tbl")
find("tr")
eq(row
)
find("td")
eq(col);
if(startCell
text() == targetCell
text() && startCell
text()!=""){
spanNum++;
targetCell
attr("rowSpan"
spanNum);
startCell
attr("style"
"visibility:hidden");
// startCell
attr("style"
"display:none");
}else{
spanNum =
;
}
startCell = targetCell;
}
}
for(var j=totalCols
;j>=
;j
){
for(var i=totalRows
;i>=
;i
){
cell = $("#tbl")
find("tr")
eq(i)
find("td")
eq(j);
if(cell
attr("style")!=undefined){
if(cell
attr("style")=="visibility:hidden"){
cell
remove();
}
}
}
}
}
function merge
(){ //与merge
方法类似
目的是看一下 display:none与visibility:hidden的效果区别
var totalCols = $("#tbl")
find("tr:eq(
)")
find("td")
length;
var totalRows = $("#tbl")
find("tr")
length;
for(var col=totalCols
;col>=
;col
){
spanNum =
;
startCell = $("#tbl")
find("tr")
eq(totalRows
)
find("td")
eq(col);
for(var row = totalRows
;row>=
;row
){
targetCell = $("#tbl")
find("tr")
eq(row
)
find("td")
eq(col);
if(startCell
text() == targetCell
text() && startCell
text()!=""){
spanNum++;
targetCell
attr("rowSpan"
spanNum);
startCell
attr("style"
"display:none");
// startCell
attr("style"
"display:none");
}else{
spanNum =
;
}
startCell = targetCell;
}
}
for(var j=totalCols
;j>=
;j
){
for(var i=totalRows
;i>=
;i
){
cell = $("#tbl")
find("tr")
eq(i)
find("td")
eq(j);
if(cell
attr("style")!=undefined){
if(cell
attr("style")=="display:none"){
cell
remove();
}
}
}
}
}
</script>
</head>
<body>
<table id="tbl" cellpadding="
" border=
>
<thead>
<tr>
<td>销售时间</td>
<td>裙子</td>
<td>裤子</td>
<td>风衣</td>
<td>鞋子</td>
</tr>
</thead>
<tbody>
<tr>
<td>
:
:
</td>
<td>
</td>
<td></td>
<td>
</td>
<td></td>
</tr>
<tr>
<td>
:
:
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
:
:
</td>
<td>
</td>
<td>
</td>
<td></td>
<td>
</td>
</tr>
<tr>
<td>
:
:
</td>
<td></td>
<td></td>
<td></td>
<td>
</td>
</tr>
</tbody>
</table>
<input type="button" value="合并" id="merge" onclick="merge
();">
</body>
</html>
总结在使用remove的时候一定要注意如果 从list的开始元素循环下去remove掉一个元素后有些元素就找不到了或者说不是要找的那个元素最好是从后面开始循环
