这个东西网上还真没有,自己琢磨的不少时间,真的有点类似于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);
}
}
}
}
}
}
}
执行效果如下:
执行删除后: