软件工程-项目总结——使用javascript对有行列合并的表格进行操作的方式

这个东西网上还真没有,自己琢磨的不少时间,真的有点类似于oi的题目一样,最后实现方式是将整个表格映射到一个二维数组,按照一定的扫描次序进行table扫描,之后进行操作。

下面是删除行或者列的操作,仅供大家参考:

这里第一行和第一列添加了checkbox,勾选checkbox删除,同时checkbox也能保证你表格行列获取一定是正确的。


function Delete(table){    
for(var i=table.rows.length - 1; i>=0;i--){    
   var chkOrder = table.rows[i].cells[0].firstChild;    
   if(chkOrder){    
    if(chkOrder.type = "CHECKBOX"){    
     if(chkOrder.checked){    
      //执行删除    
      for (var a=0;a<i;a++){
          for (var b=0;b<table.rows[a].cells.length;b++){
              var o = parseInt(table.rows[a].cells[b].rowSpan);
              var p = parseInt(table.rows[b].cells[b].colSpan);           
              if (o+a>i) {
                  o=o-1;
                  table.rows[a].cells[b].rowSpan=o.toString();
              }
          }
      }
      var coltmp=0;
      for (var j=0;j<table.rows[i].cells.length;j++){
          var o = parseInt(table.rows[i].cells[j].rowSpan);
          var p = parseInt(table.rows[i].cells[j].colSpan);
          coltmp+=p;
          if (o>1){
              o=o-1;
              var tmp=0;
              var pos=0;
              for (var k=0;k<table.rows[i+1].cells.length;k++){
                  tmp+=parseInt(table.rows[i+1].cells[k].colSpan);
                  pos = k;
                  if (tmp==coltmp)
                      break;
              }
              table.rows[i+1].insertCell(pos);
              table.rows[i+1].cells[pos].innerHTML=table.rows[i].cells[j].innerHTML;
              table.rows[i+1].cells[pos].setAttribute("align", "center");     
              table.rows[i+1].cells[pos].setAttribute("bgcolor", "#FFFFFF");
              table.rows[i+1].cells[pos].setAttribute("width", "100");
              table.rows[i+1].cells[pos].setAttribute("EditType", "TextBox");
              table.rows[i+1].cells[pos].rowSpan=o.toString();
              table.rows[i+1].cells[pos].colSpan=p.toString();
              EditTables(table);
          }
      }

      table.deleteRow(i);    
     }    
    }    
   }    
}    
for (var k = table.rows.item(0).cells.length-1; k>=0; k--)
{
    var tmp = table.rows[0].cells[k].firstChild;
    if (tmp){
        if (tmp.type = "CHECKBOX"){
            if (tmp.checked){
                var n = table.rows.length;
                var m = table.rows.item(0).cells.length;
                var flag = [];
                var bj = [];
                for (var i = 0; i<n ; i++){
                    flag[i]= [];
                    bj[i] = -1;
                    for (var j = 0 ;j< m ;j++){
                        flag[i][j]=[0,0,0,0];
                    }
                }
                for (var i = 0; i < table.rows.length; i++)    
                    for (var j = 0; j < table.rows[i].cells.length; j++) {   
                        var text = table.rows[i].cells[j].innerText;
                        var pos = j;
                        while (flag[i][pos][0]!=0&&flag[i][pos][1]!=0) pos+=1;
                        flag[i][pos]=[i,j,parseInt(table.rows[i].cells[j].rowSpan),parseInt(table.rows[i].cells[j].colSpan)];
                        var tn=parseInt(table.rows[i].cells[j].rowSpan);
                        var tm=parseInt(table.rows[i].cells[j].colSpan);
                        for (var o = 0;o<tn ;o++)
                            for (var p= 0;p<tm;p++){
                                if (o+p!=0)
                                    flag[i+o][pos+p]=[i,j,-1,-1];
                            }
                    }
                for (var i=0; i< table.rows.length;i++)
                    if (bj[i]==-1){
                        if (flag[i][k][2]==-1&&flag[i][k][3]==-1){
                            var aimCell = table.rows[flag[i][k][0]].cells[flag[i][k][1]];
                            aimCell.colSpan=(parseInt(aimCell.colSpan)-1).toString();
                            var len = aimCell.rowSpan;
                            for (tmp = 0;tmp <len ; tmp++)
                                bj[i+tmp]=0;
                        } else
                        if (flag[i][k][3]==1){
                            var a = flag[i][k][0];
                            var b = flag[i][k][1];
                            var aimCell = table.rows[a].cells[b];
                            var len = aimCell.rowSpan;
                            for (tmp = 0;tmp <len ; tmp++)
                                bj[i+tmp]=0;
                            table.rows[a].deleteCell(b);
                        } else{
                            var a = flag[i][k][0];
                            var b = flag[i][k][1];
                            var tmplen = flag[i][k][3];
                            var aimCell = table.rows[a].cells[b];
                            var len = aimCell.rowSpan;
                            for (tmp = 0;tmp <len ; tmp++)
                                bj[i+tmp]=0;
                            tmplen = tmplen -1;
                            table.rows[a].insertCell(b+1);
                            table.rows[a].cells[b+1].innerHTML = table.rows[a].cells[b].innerHTML;
                            table.rows[a].cells[b+1].rowSpan = table.rows[a].cells[b].rowSpan;
                            table.rows[a].cells[b+1].colSpan = tmplen.toString();
                            table.rows[a].cells[b+1].setAttribute("align", "center");
                            table.rows[a].cells[b+1].setAttribute("bgcolor", "#FFFFFF");
                            table.rows[a].cells[b+1].setAttribute("width", "100");
                            table.rows[a].cells[b+1].setAttribute("EditType", "TextBox");
                            table.rows[a].deleteCell(b);
                            EditTables(table);
                        }
                    } 
            }
        }
    }

}
}

执行效果如下:
这里写图片描述

执行删除后:
这里写图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值