JS层移支示例代码

<！DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML><HEAD><TITLE>课程安排</TITLE> <STYLE type=text/css>LABEL { CURSOR: hand; COLOR: lightblue; TEXT-DECORATION: underline } </STYLE> <SCRIPT LANGUAGE="JavaScript"></SCRIPT> <META content="MSHTML 5.50.4134.600" name=GENERATOR></HEAD> <BODY onselectstart=return（false）> <SCRIPT language=JavaScript> var newObj=null; DragObject.prototype.bind=bindToCell;//把拖动元素绑定到单元格 function bindToCell（cell）{ if （cell==null） return; this.cell=cell; absoluteMove（this.element,cell,（cell.offsetWidth-this.element.offsetWidth）/2,（cell.offsetHeight-this.element.offsetHeight）/2）; } //当完成拖动后,调整位置 function finishDrag（element）{ var dragObj=getRegObj（element）; if （dragObj==null） return; //按中点来计算位置 var pt=new Point（element.offsetWidth/2,element.offsetHeight/2）; pt.clientToScreen（element）; var oldZIndex=element.style.zIndex; element.style.zIndex=-1000; var cell=document.elementFromPoint（pt.x-document.body.scrollLeft,pt.y-document.body.scrollTop）; //拖动是否有效 if （cell！=null）{ if （cell.tagName=="TD"）{ //如果放在单元格上,就进行调整 var anotherDragObj=getDragObjectByCell（cell）; if （anotherDragObj==null）{ dragObj.bind（cell）; } else{ //交换 anotherDragObj.bind（dragObj.cell）; dragObj.bind（cell）; } } else{ //如果不是放在单元格上,要查看是否属于DIV var div=getParent（cell,"DIV"）; if （div！=null）{ var anotherDragObj=getRegObj（div）; if （anotherDragObj！=null）{ //如果是另一个DragObject,就交换 var c=anotherDragObj.cell; anotherDragObj.bind（dragObj.cell）; dragObj.bind（c）; } else{ dragObj.bind（dragObj.cell）; } } else{ dragObj.bind（dragObj.cell）; } } } else{ //如果不是单元格,就还原 dragObj.bind（dragObj.cell）; } element.style.zIndex=oldZIndex; } </SCRIPT> <FONTstyle="FONT-SIZE: 12px; LEFT: 50px; WIDTH: 100px; POSITION: absolute; TOP: 43px; TEXT-ALIGN: center"color=blue>待排课程<TABLE id=LeftTable style="LEFT: 50px; POSITION: absolute; TOP: 60px"cellSpacing=0 borderColorDark=white borderColorLight=black border=1> <TBODY> <TR> <TD width=100 height=12> </TD><TR> <TD width=100 height=12> </TD><TR> <TD width=100 height=12> </TD><TR> <TD width=100 height=12> </TD><TR> <TD width=100 height=12> </TD><TR> <TD width=100 height=12> </TD><TR> <TD width=100 height=12> </TD><TR> <TD width=100 height=12> </TD><TR> <TD width=100 height=12> </TD><TR> <TD width=100 height=12> </TD><TR> <TD width=100 height=12> </TD><TR> <TD width=100 height=12> </TD><TR> <TD width=100 height=12> </TD><TR> <TD width=100 height=12> </TD><TR> <TD width=100 height=12> </TD><TR> <TD width=100 height=12> </TD> </TR></TBODY></TABLE> <FONT style="FONT-SIZE: 12px; LEFT: 220px; WIDTH: 150px; POSITION: absolute; TOP: 43px; TEXT-ALIGN: center" color=blue>已排课程（上午）<TABLE id=RightTable style="LEFT: 220px; POSITION: absolute; TOP: 60px"cellSpacing=0 borderColorDark=white borderColorLight=black border=1> <TBODY> <TR><TD width=150 height=20> </TD></TR> <TR><TD width=150 height=20> </TD></TR> <TR><TD width=150 height=20> </TD></TR> <TR><TD width=150 height=20> </TD></TR> </TBODY></TABLE> <FONT style="FONT-SIZE: 12px; LEFT: 220px; WIDTH: 150px; POSITION: absolute; TOP: 153px; TEXT-ALIGN: center" color=blue>已排课程（下午）<TABLE id=Table2 style="LEFT: 220px; POSITION: absolute; TOP: 170px"cellSpacing=0 borderColorDark=white borderColorLight=black border=1> <TBODY> <TR><TD width=150 height=20> </TD></TR> <TR><TD width=150 height=20> </TD></TR> <TR><TD width=150 height=20> </TD></TR> <TR><TD width=150 height=20> </TD></TR> </TBODY></TABLE> <FONT style="FONT-SIZE: 12px; LEFT: 220px; WIDTH: 150px; POSITION: absolute; TOP: 263px; TEXT-ALIGN: center" color=blue>已排课程（晚上）<TABLE id=Table2 style="LEFT: 220px; POSITION: absolute; TOP: 280px"cellSpacing=0 borderColorDark=white borderColorLight=black border=1> <TBODY> <TR><TD width=150 height=20> </TD></TR> <TR><TD width=150 height=20> </TD></TR> <TR><TD width=150 height=20> </TD></TR> <TR><TD width=150 height=20> </TD></TR> </TBODY></TABLE> 语文 <SCRIPT language=JavaScript> newObj=registerDrag（document.all（"1"））; newObj.onDragEnd=finishDrag; newObj.bind（document.all（"LeftTable"）.rows（0）.cells（0））; </SCRIPT> 数学 <SCRIPT language=JavaScript> newObj=registerDrag（document.all（"2"））; newObj.onDragEnd=finishDrag; newObj.bind（document.all（"LeftTable"）.rows（1）.cells（0））; </SCRIPT> 物理 <SCRIPT language=JavaScript> newObj=registerDrag（document.all（"3"））; newObj.onDragEnd=finishDrag; newObj.bind（document.all（"LeftTable"）.rows（2）.cells（0））; </SCRIPT> 化学 <SCRIPT language=JavaScript> newObj=registerDrag（document.all（"4"））; newObj.onDragEnd=finishDrag; newObj.bind（document.all（"LeftTable"）.rows（3）.cells（0））; </SCRIPT> 英语 <SCRIPT language=JavaScript> newObj=registerDrag（document.all（"5"））; newObj.onDragEnd=finishDrag; newObj.bind（document.all（"LeftTable"）.rows（4）.cells（0））; </SCRIPT> 政治 <SCRIPT language=JavaScript> newObj=registerDrag（document.all（"6"））; newObj.onDragEnd=finishDrag; newObj.bind（document.all（"LeftTable"）.rows（5）.cells（0））; </SCRIPT><SCRIPT language=JavaScript> //重定位 function relocate（）{ for （var i=0;i<drag_objects.length;i++）{ drag_objects[i].bind（drag_objects[i].cell）; } }//提交到服务器 function saveChange（）{ var lngOrder,lngModuleID; var table=document.all（"RightTable"）; var lngIndex=0; var strAction="";for （var i=0;i<table.rows.length;i++）{ var row=table.rows（i）; for （var j=0;j<row.cells.length;j++）{ var cell=row.cells（j）; var dragObj=getDragObjectByCell（cell）; if （dragObj！=null）{ lngOrder=i*row.cells.length+j; lngModuleID=dragObj.element.id; if （strAction==""） strAction="？MID"+lngIndex+"="+lngModuleID+"&OR"+lngIndex+"="+lngOrder; else strAction=strAction+"&MID"+lngIndex+"="+lngModuleID+"&OR"+lngIndex+"="+lngOrder; lngIndex++; } } } if （lngIndex>0） strAction=strAction+"&count="+lngIndex; strAction="MainPageCenter.jsp"+strAction; window.location.href=strAction; }//根据绑定的Cell来得到DragObject function getDragObjectByCell（cell）{ for （var i=0;i<drag_objects.length;i++）{ if （cell==drag_objects[i].cell） return（drag_objects[i]）; } return（null）; } //得到指定类型的父对象 function getParent（objChild,strParentType）{ var objParent=objChild;if （strParentType==null || objChild==null） return（null）; strParentType=strParentType+""; while （objParent！=null && objParent.tagName.toUpperCase（）！=strParentType.toUpperCase（））{ //alert（objParent.tagName）; objParent=objParent.parentElement; } return（objParent）; }</SCRIPT> </BODY></HTML>
[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]