HTML拖、放表格

<style>

*{font-size:12px}

.dragTable{

font-size:12px;

margin-bottom:5px;

}

td{vertical-align:top;}

.dragTR{

cursor:move;

color:#7787cc;

background-color:#e5eef9;

height:20px;

padding-left:5px;

font-weight:bold;

}

#parentTable{

border-collapse:collapse;

letter-spacing:25px;

}

</style>

<scriptdefer>

varDrag={dragged:false,

ao:null,

tdiv:null,

dragStart:function(){

Drag.ao=yle="COLOR: #000000; BACKGROUND-COLOR: #f5f5f5">event.srcElement;

if((Drag.ao.tagName=="TD")||(Drag.ao.tagName=="TR")){

Drag.ao=Drag.ao.offsetParent;

Drag.ao.style.zIndex=100;

}else

return;

Drag.dragged=true;

Drag.tdiv=document.createElement("div");

Drag.tdiv.innerHTML=Drag.ao.outerHTML;

Drag.ao.style.border="1pxdashedred";

Drag.tdiv.style.display="block";

Drag.tdiv.style.position="absolute";

Drag.tdiv.style.filter="alpha(opacity=70)";

Drag.tdiv.style.cursor="move";

Drag.tdiv.style.border="1pxsolid#000000";

Drag.tdiv.style.width=Drag.ao.offsetWidth;

Drag.tdiv.style.height=Drag.ao.offsetHeight;

Drag.tdiv.style.top=Drag.getInfo(Drag.ao).top;

Drag.tdiv.style.left=Drag.getInfo(Drag.ao).left;

document.body.appendChild(Drag.tdiv);

Drag.lastX=event.clientX;

Drag.lastY=event.clientY;

Drag.lastLeft=Drag.tdiv.style.left;

Drag.lastTop

LOR: #000000; BACKGROUND-COLOR: #f5f5f5">=Drag.tdiv.style.top;

},

draging:function(){//重要:判断MOUSE的位置

if(!Drag.dragged||Drag.ao==null)return;

vartX=event.clientX;

vartY=event.clientY;

Drag.tdiv.style.left=parseInt(Drag.lastLeft)+tX-Drag.lastX;

Drag.tdiv.style.top=parseInt(Drag.lastTop)+tY-Drag.lastY;

for(vari=0;i<parentTable.cells.length;i++){

varparentCell=Drag.getInfo(parentTable.cells[i]);

if(tX>=parentCell.left&&tX<=parentCell.right&&tY>=parentCell.top&&tY<=parentCell.bottom){

varsubTables=parentTable.cells[i].getElementsByTagName("table");

if(subTables.length==0){

if

n style="COLOR: #000000; BACKGROUND-COLOR: #f5f5f5">(tX>=parentCell.left&&tX<=parentCell.right&&tY>=parentCell.top&&tY<=parentCell.bottom){

parentTable.cells[i].appendChild(Drag.ao);

}

break;

}

for(varj=0;j<subTables.length;j++){

varsubTable=Drag.getInfo(subTables[j]);

if(tX>=subTable.left&&tX<=subTable.right&&tY>=subTable.top&&tY<=subTable.bottom){

parentTable.cells[i].insertBefore(Drag.ao,subTables[j]);

break;

}else{

parentTable.cells[i].appendChild(Drag.ao);

}

}

}

}

}

dragEnd:function(){

if(!Drag.dragged)return;

Drag.dragged=false;

Drag.mm=Drag.repos(150,15);

Drag.ao.style.borderWidth="0px";

郑重声明：本文版权归原作者所有，转载文章仅为传播更多信息之目的，如作者信息标记有误，请第一时间联系我们修改或删除，多谢。