JS层移支示例代码- Javascript - 软晨网（RuanChen.com）

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > JS层移支示例代码

Javascript: 代码生成器 document.write(); 不错的文字特效，逐字变色效果; javascript下用键盘控制层的移动的代码; 有提示确定与取消功能的弹出式窗的代码; js下弹出窗口的变通; 在第一个input框内输入内容.textarea自动得到第一个文件框的值的javascript代码; 用JAVASCRIPT如何给<textarea></textarea>赋值; 将光标定位到textarea的某一行的javascript代码; 把textarea中字符串里含有的回车换行替换成<br>的javascript代码; 让textarea控件的滚动条怎是位与最下方; 用javascript实现改变TEXTAREA滚动条和按钮的颜色，以及怎样让滚动条变得扁平; 在textarea中屏蔽js的某个function的javascript代码; textarea的value是html文件源代码,存成html文件的代码; 在textarea中显示html页面的javascript代码; 用javascript将数据库中的TEXT类型数据动态赋值到TEXTAREA中; 如何做到打开一个页面，过几分钟自动转到另一页面; JS 建立对象的方法; 运用Windows XP附带的Msicuu.exe、Msizap.exe来彻底卸载顽固程序; JS Timing; 用javascript实现图片马赛克后显示并切换

No. « ‹ 62 63 64 65 › »

技术文章搜索

关键字

Javascript 中的 JS层移支示例代码

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-12 浏览: 73 ::

收藏到网摘: n/a

(function(){})()的用法与优点如何在Web页面上直接打开、编辑、创建Office文档

点击运行可以看到效果:

<!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>
<FONT
style="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>
<DIV id=1 style="WIDTH: 100px; CURSOR: hand; POSITION: absolute; HEIGHT: 12px"
align=center>语文</DIV>
<SCRIPT language=JavaScript> newObj=registerDrag(document.all("1")); newObj.onDragEnd=finishDrag; newObj.bind(document.all("LeftTable").rows(0).cells(0)); </SCRIPT>
<DIV id=2 style="WIDTH: 100px; CURSOR: hand; POSITION: absolute; HEIGHT: 12px"
align=center>数学</DIV>
<SCRIPT language=JavaScript> newObj=registerDrag(document.all("2")); newObj.onDragEnd=finishDrag; newObj.bind(document.all("LeftTable").rows(1).cells(0)); </SCRIPT>
<DIV id=3 style="WIDTH: 100px; CURSOR: hand; POSITION: absolute; HEIGHT: 12px"
align=center>物理</DIV>
<SCRIPT language=JavaScript> newObj=registerDrag(document.all("3")); newObj.onDragEnd=finishDrag; newObj.bind(document.all("LeftTable").rows(2).cells(0)); </SCRIPT>
<DIV id=4 style="WIDTH: 100px; CURSOR: hand; POSITION: absolute; HEIGHT: 12px"
align=center>化学</DIV>
<SCRIPT language=JavaScript> newObj=registerDrag(document.all("4")); newObj.onDragEnd=finishDrag; newObj.bind(document.all("LeftTable").rows(3).cells(0)); </SCRIPT>
<DIV id=5 style="WIDTH: 100px; CURSOR: hand; POSITION: absolute; HEIGHT: 12px"
align=center>英语</DIV>
<SCRIPT language=JavaScript> newObj=registerDrag(document.all("5")); newObj.onDragEnd=finishDrag; newObj.bind(document.all("LeftTable").rows(4).cells(0)); </SCRIPT>
<DIV id=6 style="WIDTH: 100px; CURSOR: hand; POSITION: absolute; HEIGHT: 12px"
align=center>政治</DIV>
<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 全选提示:你可先修改部分代码,再按运行]

(function(){})()的用法与优点如何在Web页面上直接打开、编辑、创建Office文档

Javascript 中的 JS层移支示例代码

评论 (0) All