js一些常见的问题与解决代码(转自www.51js.com)

最新推荐文章于 2024-03-16 19:35:55 发布

Jofee

最新推荐文章于 2024-03-16 19:35:55 发布

阅读量3.6k

点赞数

分类专栏： Web 文章标签： javascript function border input button class

Web 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

判断一个层是否被隐藏？例如，如果某一个层是被隐藏的就弹出＂你好＂的新窗口

提示：你可以先修改部分代码再运行

如何做网站中滚动的文字，还带超链接

提示：你可以先修改部分代码再运行

如何在javascript中使表单中的一个按钮无效

提示：你可以先修改部分代码再运行

可不可以做一个JS是只这个移动功能，在做网页时，想让哪个表格移动，就调用这个JS？
( 方法一 )

<SCRIPT
LANGUAGE="JavaScript">

</SCRIPT>
<BODY>
<TABLE width="100" border=1 onselectstart="return false"
style="position:absolute;left:50;top:50" οnmοusedοwn="f_mdown(this)"
οnmοusemοve="f_move(this)">
<TR> <TD bgcolor="#CCCCCC" align="center"
style="cursor:move">title1</TD>
</TR>
<TR> <TD align="center" height="60">content</TD>
</TR>
</TABLE>
<TABLE width="100" border=1 onselectstart="return false"
style="position:absolute;left:350;top:250" οnmοusedοwn="f_mdown(this)"
οnmοusemοve="f_move(this)">
<TR> <TD bgcolor="#CCCCCC" align="center"
style="cursor:move">title2</TD>
</TR>
<TR> <TD align="center" height="60">content</TD>
</TR>
</TABLE>
</BODY>

提示：你可以先修改部分代码再运行
( 方法二 )

<SCRIPT
LANGUAGE="JavaScript">

</SCRIPT>
<BODY>
<TABLE width="100" border=1 onselectstart="return false"
style="position:absolute;left:50;top:50" οnmοusedοwn="f_mdown(this)"
οnmοusemοve="f_move(this)">
<TR> <TD bgcolor="#CCCCCC" align="center"
style="cursor:move">title1</TD>
</TR>
<TR> <TD align="center" height="60">content</TD>
</TR>
</TABLE>
<TABLE width="100" border=1 onselectstart="return false"
style="position:absolute;left:350;top:250" οnmοusedοwn="f_mdown(this)"
οnmοusemοve="f_move(this)">
<TR> <TD bgcolor="#CCCCCC" align="center"
style="cursor:move">title2</TD>
</TR>
<TR> <TD align="center" height="60">content</TD>
</TR>
</TABLE>
</BODY>

   提示：你可以先修改部分代码再运行

刷新框架

我有一个框架网页，左右2个网页，现在我在主窗口（右页面）登陆后返回到主窗口页面，我如何让左边页面也能刷新呢？

<body οnlοad="parent.leftFrame.location.reload();">

或者在页面的最后:
<script>
//leftFrame指左边框架的名字
parent.leftFrame.location.reload();
</script>

ID与name的区别

一个元素定义了id，引用该元素时直接用id属性，而name通常用在form中，且必须由document.form.***而来，也就是说，name属性定义的元素在脚本中是document对象的子对象。

我说不太清楚，反正这么个意思。
此外，ID标识在一个页面中原则上应该唯一，而name则不一定。

我要用文字做按扭提交表单，不用input，怎么做？

   提示：你可以先修改部分代码再运行

图片reset表单

   提示：你可以先修改部分代码再运行

页面有多个CSS做个check box让用户选择

<HTML>
<HEAD>
<TITLE>换肤技术新的尝试</TITLE>
<link ID="skin" rel="stylesheet" type="text/css">
<SCRIPT LANGUAGE=javascript>

</SCRIPT>
</HEAD>
<BODY>
<P>请选择下面的下拉菜单测试换肤效果</P>
<select οnchange="changecss(this.value)">
<option>选择样式单文件</option>
<script language="javascript">
var csss=new Array();
csss[0]="001.css";
csss[1]="002.css";
csss[2]="003.css";
csss[3]="004.css";
var i;
for(i=0;i<4;i++) if(thisskin==csss[i]) document.write("<option
value=/""+csss[i]+"/" selected>"+csss[i]+"样式单文件</option>");
else document.write("<option
value=/""+csss[i]+"/">"+csss[i]+"样式单文件</option>");
</script>
</select>
</BODY>
</HTML>

<HTML>
<HEAD>
<TITLE>滚动效果</TITLE>
</HEAD>
<BODY>
<table>
<tr><td style="padding: 5">
<div id="testDiv" style="border: buttonface 2 solid">
<img
src=http://be10.ods.org/51js/images/standard/51js.gif>这可以是任意的内容
</div>
<script language="JScript">
function scroll(obj, oWidth, oHeight, direction, drag, zoom, speed)
{ var scrollDiv = obj var scrollContent =
document.createElement("span") scrollContent.style.position =
"absolute" scrollDiv.applyElement(scrollContent, "inside") var
displayWidth = (oWidth != "auto" && oWidth ) ? oWidth :
scrollContent.offsetWidth +
parseInt(scrollDiv.currentStyle.borderRightWidth) var displayHeight =
(oHeight != "auto" && oHeight) ? oHeight :
scrollContent.offsetHeight +
parseInt(scrollDiv.currentStyle.borderBottomWidth) var contentWidth =
scrollContent.offsetWidth var contentHeight =
scrollContent.offsetHeight var scrollXItems = Math.ceil(displayWidth /
contentWidth) + 1 var scrollYItems = Math.ceil(displayHeight /
contentHeight) + 1 scrollDiv.style.width = displayWidth
scrollDiv.style.height = displayHeight scrollDiv.style.overflow =
"hidden" scrollDiv.setAttribute("state", "stop")
scrollDiv.setAttribute("drag", drag ? drag : "horizontal")
scrollDiv.setAttribute("direction", direction ? direction : "left")
scrollDiv.setAttribute("zoom", zoom ? zoom : 1)
scrollContent.style.zoom = scrollDiv.zoom var scroll_script = "var
scrollDiv = " + scrollDiv.uniqueID +"/n"+ "var scrollObj = " +
scrollContent.uniqueID +"/n"+ "var contentWidth = " + contentWidth + "
* (scrollObj.runtimeStyle.zoom ? scrollObj.runtimeStyle.zoom : 1)"
+"/n"+ "var contentHeight = " + contentHeight + " *
(scrollObj.runtimeStyle.zoom ? scrollObj.runtimeStyle.zoom : 1)" +"/n"+
"var scrollx = scrollObj.runtimeStyle.pixelLeft" +"/n"+ "var scrolly =
scrollObj.runtimeStyle.pixelTop" +"/n"+ "switch
(scrollDiv.state.toLowerCase())" +"/n"+ "{" +"/n"+ "case ('scroll') :"
+"/n"+ "switch (scrollDiv.direction)" +"/n"+ "{" +"/n"+ "case ('left')
:" +"/n"+ "scrollx = (--scrollx) % contentWidth" +"/n"+ "break" +"/n"+
"case ('right') :" +"/n"+ "scrollx = -contentWidth + (++scrollx) %
contentWidth" +"/n"+ "break" +"/n"+ "case ('up') :" +"/n"+ "scrolly =
(--scrolly) % contentHeight" +"/n"+ "break" +"/n"+ "case ('down') :"
+"/n"+ "scrolly = -contentHeight + (++scrolly) % contentHeight" +"/n"+
"break" +"/n"+ "case ('left_up') :" +"/n"+ "scrollx = (--scrollx) %
contentWidth" +"/n"+ "scrolly = (--scrolly) % contentHeight" +"/n"+
"break" +"/n"+ "case ('left_down') :" +"/n"+ "scrollx = (--scrollx) %
contentWidth" +"/n"+ "scrolly = -contentHeight + (++scrolly) %
contentHeight" +"/n"+ "break" +"/n"+ "case ('right_up') :" +"/n"+
"scrollx = -contentWidth + (++scrollx) % contentWidth" +"/n"+ "scrolly
= (--scrolly) % contentHeight" +"/n"+ "break" +"/n"+ "case
('right_down') :" +"/n"+ "scrollx = -contentWidth + (++scrollx) %
contentWidth" +"/n"+ "scrolly = -contentHeight + (++scrolly) %
contentHeight" +"/n"+ "break" +"/n"+ "default :" +"/n"+ "return" +"/n"+
"}" +"/n"+ "scrollObj.runtimeStyle.left = scrollx" +"/n"+
"scrollObj.runtimeStyle.top = scrolly" +"/n"+ "break" +"/n"+ "case
('stop') :" +"/n"+ "case ('drag') :" +"/n"+ "default :" +"/n"+ "return"
+"/n"+ "}" var contentNode = document.createElement("span")
contentNode.runtimeStyle.position = "absolute"
contentNode.runtimeStyle.width = contentWidth
scrollContent.applyElement(contentNode, "inside") for (var i=0; i <=
scrollXItems; i++) { for (var j=0; j <= scrollYItems ; j++) { if
(i+j == 0) continue var tempNode = contentNode.cloneNode(true) var
contentLeft, contentTop scrollContent.insertBefore(tempNode)
contentLeft = contentWidth * i contentTop = contentHeight * j
tempNode.runtimeStyle.left = contentLeft tempNode.runtimeStyle.top =
contentTop } } scrollDiv.onpropertychange = function() { var
propertyName = window.event.propertyName var propertyValue =
eval("this." + propertyName) switch(propertyName) { case "zoom" : var
scrollObj = this.children[0] scrollObj.runtimeStyle.zoom =
propertyValue var content_width = scrollObj.children[0].offsetWidth *
propertyValue var content_height = scrollObj.children[0].offsetHeight *
propertyValue scrollObj.runtimeStyle.left = -content_width +
(scrollObj.runtimeStyle.pixelLeft % content_width)
scrollObj.runtimeStyle.top = -content_height +
(scrollObj.runtimeStyle.pixelTop % content_height) break } }
scrollDiv.onlosecapture = function() { this.state = this.tempState ?
this.tempState : this.state this.runtimeStyle.cursor = ""
this.removeAttribute("tempState") this.removeAttribute("start_x")
this.removeAttribute("start_y") this.removeAttribute("default_left")
this.removeAttribute("default_top") } scrollDiv.onmousedown =
function() { if (this.state != "drag") this.setAttribute("tempState",
this.state) this.state = "drag" this.runtimeStyle.cursor = "default"
this.setAttribute("start_x", event.clientX)
this.setAttribute("start_y", event.clientY)
this.setAttribute("default_left", this.children[0].style.pixelLeft)
this.setAttribute("default_top", this.children[0].style.pixelTop)
this.setCapture() } scrollDiv.onmousemove = function() { if (this.state
!= "drag") return var scrollx = scrolly = 0 var zoomValue =
this.children[0].style.zoom ? this.children[0].style.zoom : 1 var
content_width = this.children[0].children[0].offsetWidth * zoomValue
var content_Height = this.children[0].children[0].offsetHeight *
zoomValue if (this.drag == "horizontal" || this.drag == "both") {
scrollx = this.default_left + event.clientX - this.start_x scrollx =
-content_width + scrollx % content_width
this.children[0].runtimeStyle.left = scrollx } if (this.drag ==
"vertical" || this.drag == "both") { scrolly = this.default_top +
event.clientY - this.start_y scrolly = -content_Height + scrolly %
content_Height this.children[0].runtimeStyle.top = scrolly } }
scrollDiv.onmouseup = function() { this.releaseCapture() }
scrollDiv.state = "scroll" setInterval(scroll_script, speed ? speed :
20)
}
</script>
<script language="JScript">
window.onload = new Function("scroll(document.all['testDiv'], 325)")
</script>
<br>
<button οnclick="testDiv.direction='up';
testDiv.state='scroll'"><span style="font-family:
Webdings">5</span>向上</button>
<button οnclick="testDiv.direction='left';
testDiv.state='scroll'"><span style="font-family:
Webdings">3</span>向左</button>
<button οnclick="testDiv.state='stop'"><span
style="font-family: Webdings">;</span>停止</button>
<button οnclick="testDiv.state='scroll'"><span
style="font-family: Webdings">8</span>播放</button>
<button οnclick="testDiv.direction='right';
testDiv.state='scroll'"><span style="font-family:
Webdings">4</span>向右</button>
<button οnclick="testDiv.direction='down';
testDiv.state='scroll'"><span style="font-family:
Webdings">6</span>向下</button>
<br>
缩放：
<select οnchange="testDiv.zoom =
this.options[selectedIndex].value"> <option
value=1>100%</option> <option
value=2>200%</option> <option
value=3>300%</option>
</select>　　　　　
托动范围：
<select οnchange="testDiv.drag =
this.options[selectedIndex].value"> <option
value="both">随意</option> <option value="horizontal"
selected>横向</option> <option
value="vertical">纵向</option>
</select>
</td></tr>
</table>
</BODY>
</HTML>

提示：你可以先修改部分代码再运行

按button粘贴到text里

提示：你可以先修改部分代码再运行

打印网页中的某一个区域

要打印的部分，前后各加个“”，“”，然后，写个按钮或者是什么的调用以下函数，比如：

提示：你可以先修改部分代码再运行

关闭窗口三种办法

方法一：window.close();
通常情况下：window.opener=null;window.close();都是可行的。
但如帖子 http://be10.ods.org/51js/viewthread.php?tid=11389
所述的情况下，window.close()失效
方法二：
<object id=hh1 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">
<param name="Command" value="Minimize"></object>
<object id=hh2 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">
<param name="Command" value="Maximize"></object>
<OBJECT id=hh3 classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11">
<PARAM NAME="Command" VALUE="Close"></OBJECT>

<input type=button value=最小化 οnclick=hh1.Click()>
<input type=button value=最大化 οnclick=hh2.Click()>
<input type=button value=关闭 οnclick=hh3.Click()>
本例适用于IE
但在通常的网页中，结果是：“仅在HTML帮助中才有此功能”！

方法三：
<OBJECT id=WebBrowser classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2
height=0 width=0></OBJECT>

window.document.all.WebBrowser.ExecWB(45,1);
此法解决了帖子 http://be10.ods.org/51js/viewthread.php?tid=11389
所述的问题，但有限制，就是要降低IE的安全级别。

让标题动态

parent.window.document.title=tx[wo].substr(0, i)+"_"; 
setTimeout("animatetitle()",100); 
} 
animatetitle();
// --></script><script language="JavaScript">

</script>

<HTML><HEAD>
<TITLE>锁定表格栏位范例网页</TITLE>
<META http-equiv=Content-Type content="text/html;
charset=gb2312">
<STYLE type=text/css>BODY { FONT: 12px 细明体; CURSOR: default
}
TD { FONT: 12px 细明体; CURSOR: default
}
.title { BORDER-RIGHT: #555 1px solid; PADDING-RIGHT: 4px; BORDER-TOP:
#fff 1px solid; PADDING-LEFT: 4px; BACKGROUND: #ccc; PADDING-BOTTOM:
4px; OVERFLOW: hidden; BORDER-LEFT: #fff 1px solid; CURSOR: hand;
PADDING-TOP: 4px; BORDER-BOTTOM: #555 1px solid; WHITE-SPACE: nowrap
}
.cdata { BORDER-RIGHT: #ddd 1px solid; PADDING-RIGHT: 3px; BORDER-TOP:
#fff 1px solid; PADDING-LEFT: 3px; BACKGROUND: #fff; PADDING-BOTTOM:
3px; OVERFLOW: hidden; BORDER-LEFT: #fff 1px solid; PADDING-TOP: 3px;
BORDER-BOTTOM: #ddd 1px solid; WHITE-SPACE: nowrap
}
</STYLE>
<SCRIPT language=JavaScript >
// 栏位标题 ( 栏位名称 # 栏位宽度 # 资料对齐 )
var DataTitles=new Array(
"歌手 / 团体#90 #left" ,
"专辑名称 #130#left" ,
"发行公司 #110#left" ,
"本周排名 #58 #center",
"排名状况 #58 #center",
"上周排名 #58 #center",
"上榜周数 #58 #center",
"最高名次 #58 #center",
"销售百分比 #70 #center")
// 栏位资料 ( 二维阵列 )
var DataFields=new Array()
DataFields[0] =new Array("萧亚轩" ,"爱的主打歌-吻" ,"维京 Virgin" ,"1" ,"持平" ,"1"
,"2","1" ,"2.9 %")
DataFields[1] =new Array("张惠妹" ,"发烧" ,"华纳 Warner" ,"2" ,"持平" ,"2"
,"2","2" ,"2.1 %")
DataFields[2] =new Array("陶吉吉" ,"黑色柳丁" ,"全员集合 Shock" ,"3" ,"持平" ,"3"
,"5","1" ,"1.8 %")
DataFields[3] =new Array("S.H.E" ,"美丽新世界" ,"华研 HIM" ,"4" ,"持平" ,"4"
,"6","1" ,"1.2 %")
DataFields[4] =new Array("艾薇儿" ,"展翅高飞" ,"博德曼 BMG" ,"5" ,"新进榜","-"
,"1","5" ,"1.1 %")
DataFields[5] =new Array("任贤齐" ,"一个任贤齐" ,"滚石 Rock" ,"6" ,"新进榜","-"
,"1","6" ,"1.0 %")
DataFields[6] =new Array("范逸臣" ,"范逸臣第一张专辑","丰华 Forward" ,"7" ,"持平" ,"7"
,"2","7" ,"0.9 %")
DataFields[7] =new Array("谢霆锋" ,"无形的他全精选" ,"新力 Sony" ,"8" ,"下跌" ,"6"
,"4","4" ,"0.9 %")
DataFields[8] =new Array("周蕙" ,"寂寞城市" ,"福茂 Decca" ,"9" ,"下跌" ,"5"
,"3","5" ,"0.8 %")
DataFields[9] =new Array("周杰伦" ,"八度空间" ,"博德曼 BMG" ,"10","下跌" ,"8"
,"8","1" ,"0.8 %")
DataFields[10]=new Array("酷玩乐团","玩过头" ,"科艺百代 EMI" ,"11","上升"
,"16","2","11","0.7 %")
DataFields[11]=new Array("张震岳" ,"等我有一天" ,"魔岩 Magicstone","12","新进榜","-"
,"1","12","0.6 %")
DataFields[12]=new Array("堂本刚" ,"红与蓝" ,"艾回 Avex" ,"13","新进榜","-"
,"1","13","0.6 %")
DataFields[13]=new Array("ENERGY" ,"COME ON" ,"环球 Universal" ,"14","下跌"
,"10","9","5" ,"0.6 %")
DataFields[14]=new Array("陈冠希" ,"TRANSITION" ,"艾回 Avex" ,"15","下跌" ,"9"
,"3","5" ,"0.4 %")
DataFields[15]=new Array("合辑" ,"MTV 嘻哈大师" ,"环球 Universal" ,"16","下跌"
,"12","3","12","0.4 %")
</SCRIPT>
<SCRIPT language=JavaScript>
var BoxWidth = 480 // 资料表显示宽度 ( 不含卷轴 )
var ShowLine = 10 // 资料表显示列数
var RsHeight = 21 // 资料列高度
var LockCols = 1 // 要锁定的栏位数 ( 由左至右 )
function WriteTable(){ // 写入表格
var iBoxWidth=BoxWidth
var NewHTML="<table border=/"0/" cellpadding=/"0/"
cellspacing=/"0/"><tr>/
<td><div style=/"width:100%;overflow-x:scroll/">/
<table border=/"0/" cellpadding=/"0/"
cellspacing=/"0/"><tr>"
for(i=0;i<DataTitles.length;i++){ if(i<LockCols){ var
cTitle=DataTitles[i].split("#") iBoxWidth-=cTitle[1] var
DynTip=((i+1)==LockCols)?"解除锁定":"锁定此栏位" NewHTML+="<td><div
class=/"title/" style=/"width:"+cTitle[1]+"px;height:"+RsHeight+"px/"
title=/""+DynTip+"/"
οnclick=/"ResetTable("+i+")/">"+cTitle[0]+"</div></td>"
}
}
NewHTML+="</tr>/
<tr><td colspan=/""+LockCols+"/">/
<div id=/"DataFrame1/"
style=/"position:relative;width:100%;overflow:hidden/">/
<div id=/"DataGroup1/"
style=/"position:relative/"></div></div>/
</td></tr></table></div></td>/
<td valign=/"top/"><div
style=/"width:"+iBoxWidth+"px;overflow-x:scroll/">/
<table border=/"0/" cellpadding=/"0/"
cellspacing=/"0/"><tr>"
for(i=0;i<DataTitles.length;i++){ if(i>=LockCols){ var
cTitle=DataTitles[i].split("#") NewHTML+="<td><div
class=/"title/" style=/"width:"+cTitle[1]+"px;height:"+RsHeight+"px/"
title=/"锁定此栏位/"
οnclick=/"ResetTable("+i+")/">"+cTitle[0]+"</div></td>"
}
}
NewHTML+="</tr>/
<tr><td colspan=/""+(DataTitles.length-LockCols)+"/">/
<div id=/"DataFrame2/"
style=/"position:relative;width:100%;overflow:hidden/">/
<div id=/"DataGroup2/" style=/"position:relative/"></div>/
</div></td></tr></table>/
</div></td><td valign=/"top/">/
<div id=/"DataFrame3/"
style=/"position:relative;background:#000;overflow-y:scroll/"
οnscrοll=/"SYNC_Roll()/">/
<div id=/"DataGroup3/"
style=/"position:relative;width:1px;visibility:hidden/"></div>/
</div></td></tr></table>"
DataTable.innerHTML=NewHTML
ApplyData()
}
function ApplyData(){ // 写入资料
var NewHTML="<table border=/"0/" cellpadding=/"0/"
cellspacing=/"0/">"
for(i=0;i<DataFields.length;i++){ NewHTML+="<tr>"
for(j=0;j<DataTitles.length;j++){ if(j<LockCols){ var
cTitle=DataTitles[j].split("#") NewHTML+="<td><div
class=/"cdata/"
style=/"width:"+cTitle[1]+"px;height:"+RsHeight+"px;text-align:"+cTitle[2]+"/">"+DataFields[i][j]+"</div></td>"
} } NewHTML+="</tr>"
}
NewHTML+="</table>"
DataGroup1.innerHTML=NewHTML
var NewHTML="<table border=/"0/" cellpadding=/"0/"
cellspacing=/"0/">"
for(i=0;i<DataFields.length;i++){ NewHTML+="<tr>"
for(j=0;j<DataTitles.length;j++){ if(j>=LockCols){ var
cTitle=DataTitles[j].split("#") NewHTML+="<td><div
class=/"cdata/"
style=/"width:"+cTitle[1]+"px;height:"+RsHeight+"px;text-align:"+cTitle[2]+"/">"+DataFields[i][j]+"</div></td>"
} } NewHTML+="</tr>"
}
NewHTML+="</table>"
DataGroup2.innerHTML=NewHTML
DataFrame1.style.pixelHeight=RsHeight*ShowLine
DataFrame2.style.pixelHeight=RsHeight*ShowLine
DataFrame3.style.pixelHeight=RsHeight*ShowLine+RsHeight
DataGroup3.style.pixelHeight=RsHeight*(DataFields.length+1)
}
function ResetTable(n){
var iBoxWidth=0
for(i=0;i<DataTitles.length;i++){ if(i<(n+1)){ var
cTitle=DataTitles[i].split("#") iBoxWidth+=parseInt(cTitle[1]) }
}
if(iBoxWidth>BoxWidth){ var
Sure=confirm("/n锁定栏位的宽度大於资料表显示的宽　　/n/n度，这可能会造成版面显示不正常。/n/n/n您确定要继续吗？")
}else{ Sure=true
}
if(Sure){ LockCols=(LockCols==n+1)?0:n+1 WriteTable()
}
}
function SYNC_Roll(){
DataGroup1.style.posTop=-DataFrame3.scrollTop
DataGroup2.style.posTop=-DataFrame3.scrollTop
}
window.οnlοad=WriteTable
</SCRIPT>
<META content="MSHTML 6.00.2800.1170"
name=GENERATOR></HEAD>
<BODY>
<CENTER>
<H4>锁定表格栏位范例网页</H4>
<TABLE cellSpacing=0 cellPadding=0 border=0> <TBODY>
<TR> <TD style="BORDER-RIGHT: white 2px inset; BORDER-TOP:
white 2px inset; BORDER-LEFT: white 2px inset; BORDER-BOTTOM: white 2px
inset; BACKGROUND-COLOR: scrollbar"> <DIV
id=DataTable></DIV></TD></TR></TBODY></TABLE>
<P>点取栏位标题可重新设定或解除目前的锁定状态</P></CENTER></BODY><
/HTML>

提示：你可以先修改部分代码再运行

三级下拉菜单

<html>
<head>
<title> 很简单的菜单条，但是有三级菜单，使用方便简单，酷 </title>
<meta http-equiv="Content-Type" content="text/html;
charset=gb2312">
<style type="text/css">

</style>
</head>
<body bgcolor="#FFFFFF">
<table width="500" border="0" align="center"> <tr> <td
width="80%" bgcolor="#FF99CC" height="34"> <div
align="center">26. 很简单的菜单条，但是有三级菜单，使用方便简单，酷 </div> </td>
</tr>
</table>
<table border="0" width="500" align="center"> <tr> <td
bgcolor="#6699FF"> <p> <script>
//菜单一 first
item----------------------------------------------------------
var item_num=3; //父层菜单的行数 Hom many rows is the parent item
var item02_word=new Array(); //菜单的文字 The words of the child item
for(i=0;i<item_num;i++) item02_word[i]=new Array();
item02_word[0][0]="市长致词02"; item02_word[0][1]="市民意见";
item02_word[0][2]="市民投诉"; item02_word[1][0]="市政领导02";
item02_word[1][1]="部门机构"; item02_word[1][2]="部门职责";
item02_word[2][0]="最新发布02"; item02_word[2][1]="综合经济";
item02_word[2][2]="科教文化";
var item02_link=new Array(); //菜单的链接 The links of the child item
for(i=0;i<item_num;i++) item02_link[i]=new Array();
item02_link[0][0]="#none"; item02_link[0][1]="#none"
item02_link[0][2]="#none" item02_link[1][0]="#none";
item02_link[1][1]="#none"; item02_link[1][2]="#none";
item02_link[2][0]="#none"; item02_link[2][1]="#none";
item02_link[2][2]="#none";
var item02=new Array(); //菜单的HTML The HTML code of the child item
for(i=0;i<item_num;i++) item02[i]="";
for(i=0;i<item_num;i++) for(j=0;j<item02_word[i].length;j++)
item02[i]+=" | -<img border=0 src=list3.gif><a class=childlink
href="+item02_link[i][j]+"
οnclick=javascript:this.blur();>"+item02_word[i][j]+"</a><br>";
//------------定义一个清空各菜单的函数--------------
function closeItemTable02()
{ for(i=0;i<item_num;i++) {
document.all.itemTable02.cells[2*i+1].innerHTML="";
item02Img[i].src="list.gif"; }
}
//------------------定义结束----------------------
//------------定义一个菜单展开的函数----------------
function openItemTable02(n)
{ if(document.all.itemTable02.cells[n*2+1].innerHTML=="") {
closeItemTable02(); item02Img[n].src="list2.gif";
document.all.itemTable02.cells[n*2+1].innerHTML=item02[n]; } else
closeItemTable02();
}
//------------------定义结束----------------------
var item02_view=new Array();
item02_view[0]="<table id=itemTable02 cellpadding=0 cellspacing=0
border=0>/n";
item02_view[1]=" <tr><td valign=bottom> -<img
name=item02Img name=treeImg src=list.gif border=0><a id=item_1
class=parentlink href=javascript:
οnclick=javascript:openItemTable02(0);this.blur();>市长室</a><
/td></tr>/n";
item02_view[2]=" <tr><td
class=childlink></td></tr>/n";
item02_view[3]=" <tr><td valign=bottom> -<img
name=item02Img name=treeImg src=list.gif border=0><a id=item_2
class=parentlink href=javascript:
οnclick=javascript:openItemTable02(1);this.blur();>政府政务</a><
/td></tr>/n";
item02_view[4]=" <tr><td
class=childlink></td></tr>/n";
item02_view[5]=" <tr><td valign=bottom> -<img
name=item02Img name=treeImg src=list.gif border=0><a id=item_3
class=parentlink href=javascript:
οnclick=javascript:openItemTable02(2);this.blur();>政策法规</a><
/td></tr>/n";
item02_view[6]=" <tr><td
class=childlink></td></tr>/n";
item02_view[7]="</table>/n";
var item02_all="";
for(i=0;i<item02_view.length;i++) item02_all+=item02_view[i];
</script> <script>
//菜单一 first
item----------------------------------------------------------
var item_num=3; //父层菜单的行数 Hom many rows is the parent item
var item01_word=new Array(); //菜单的文字 The words of the child item
for(i=0;i<item_num;i++) item01_word[i]=new Array();
item01_word[0][0]="市长致词01"; item01_word[0][1]="市民意见";
item01_word[0][2]="市民投诉"; item01_word[1][0]="市政领导01";
item01_word[1][1]="部门机构"; item01_word[1][2]="部门职责";
item01_word[2][0]="最新发布01"; item01_word[2][1]="综合经济";
item01_word[2][2]="科教文化";
var item01_link=new Array(); //菜单的链接 The links of the child item
for(i=0;i<item_num;i++) item01_link[i]=new Array();
item01_link[0][0]="#none"; item01_link[0][1]="#none"
item01_link[0][2]="#none" item01_link[1][0]="#none";
item01_link[1][1]="#none"; item01_link[1][2]="#none";
item01_link[2][0]="#none"; item01_link[2][1]="#none";
item01_link[2][2]="#none";
var item01=new Array(); //菜单的HTML The HTML code of the child item
for(i=0;i<item_num;i++) item01[i]="";
for(i=0;i<item_num;i++) for(j=0;j<item01_word[i].length;j++)
item01[i]+=" | -<img border=0 src=list3.gif><a class=childlink
href="+item01_link[i][j]+"
οnclick=javascript:this.blur();>"+item01_word[i][j]+"</a><br>";
//------------定义一个清空各菜单的函数--------------
function closeItemTable01()
{ for(i=0;i<item_num;i++) {
document.all.itemTable01.cells[2*i+1].innerHTML="";
item01Img[i].src="list.gif"; }
}
//------------------定义结束----------------------
//------------定义一个菜单展开的函数----------------
function openItemTable01(n)
{ if(document.all.itemTable01.cells[n*2+1].innerHTML=="") {
closeItemTable01(); item01Img[n].src="list2.gif";
document.all.itemTable01.cells[n*2+1].innerHTML=item01[n]; } else
closeItemTable01();
}
//------------------定义结束----------------------
var item01_view=new Array();
item01_view[0]="<table id=itemTable01 cellpadding=0 cellspacing=0
border=0>/n";
item01_view[1]=" <tr><td valign=bottom> -<img
name=item01Img name=treeImg src=list.gif border=0><a id=item_1
class=parentlink href=javascript:
οnclick=javascript:openItemTable01(0);this.blur();>市长室</a><
/td></tr>/n";
item01_view[2]=" <tr><td
class=childlink></td></tr>/n";
item01_view[3]=" <tr><td valign=bottom> -<img
name=item01Img name=treeImg src=list.gif border=0><a id=item_2
class=parentlink href=javascript:
οnclick=javascript:openItemTable01(1);this.blur();>政府政务</a><
/td></tr>/n";
item01_view[4]=" <tr><td
class=childlink></td></tr>/n";
item01_view[5]=" <tr><td valign=bottom> -<img
name=item01Img name=treeImg src=list.gif border=0><a id=item_3
class=parentlink href=javascript:
οnclick=javascript:openItemTable01(2);this.blur();>政策法规</a><
/td></tr>/n";
item01_view[6]=" <tr><td
class=childlink></td></tr>/n";
item01_view[7]="</table>/n";
var item01_all="";
for(i=0;i<item01_view.length;i++) item01_all+=item01_view[i];
</script> <script>
//菜单一 first
item----------------------------------------------------------
var item_num=3; //父层菜单的行数 Hom many rows is the parent item
var item00_word=new Array(); //菜单的文字 The words of the child item
for(i=0;i<item_num;i++) item00_word[i]=new Array();
item00_word[0][0]="市长致词00"; item00_word[0][1]="市民意见";
item00_word[0][2]="市民投诉"; item00_word[1][0]="市政领导00";
item00_word[1][1]="部门机构"; item00_word[1][2]="部门职责";
item00_word[2][0]="最新发布00"; item00_word[2][1]="综合经济";
item00_word[2][2]="科教文化";
var item00_link=new Array(); //菜单的链接 The links of the child item
for(i=0;i<item_num;i++) item00_link[i]=new Array();
item00_link[0][0]="#none"; item00_link[0][1]="#none"
item00_link[0][2]="#none" item00_link[1][0]="#none";
item00_link[1][1]="#none"; item00_link[1][2]="#none";
item00_link[2][0]="#none"; item00_link[2][1]="#none";
item00_link[2][2]="#none";
var item00=new Array(); //菜单的HTML The HTML code of the child item
for(i=0;i<item_num;i++) item00[i]="";
for(i=0;i<item_num;i++) for(j=0;j<item00_word[i].length;j++)
item00[i]+=" | -<img border=0 src=list3.gif><a class=childlink
href="+item00_link[i][j]+"
οnclick=javascript:this.blur();>"+item00_word[i][j]+"</a><br>";
//------------定义一个清空各菜单的函数--------------
function closeItemTable00()
{ for(i=0;i<item_num;i++) {
document.all.itemTable00.cells[2*i+1].innerHTML="";
item00Img[i].src="list.gif"; }
}
//------------------定义结束----------------------
//------------定义一个菜单展开的函数----------------
function openItemTable00(n)
{ if(document.all.itemTable00.cells[n*2+1].innerHTML=="") {
closeItemTable00(); item00Img[n].src="list2.gif";
document.all.itemTable00.cells[n*2+1].innerHTML=item00[n]; } else
closeItemTable00();
}
//------------------定义结束----------------------
var item00_view=new Array();
item00_view[0]="<table id=itemTable00 cellpadding=0 cellspacing=0
border=0>/n";
item00_view[1]=" <tr><td valign=bottom> -<img
name=item00Img name=treeImg src=list.gif border=0><a id=item_1
class=parentlink href=javascript:
οnclick=javascript:openItemTable00(0);this.blur();>市长室</a><
/td></tr>/n";
item00_view[2]=" <tr><td
class=childlink></td></tr>/n";
item00_view[3]=" <tr><td valign=bottom> -<img
name=item00Img name=treeImg src=list.gif border=0><a id=item_2
class=parentlink href=javascript:
οnclick=javascript:openItemTable00(1);this.blur();>政府政务</a><
/td></tr>/n";
item00_view[4]=" <tr><td
class=childlink></td></tr>/n";
item00_view[5]=" <tr><td valign=bottom> -<img
name=item00Img name=treeImg src=list.gif border=0><a id=item_3
class=parentlink href=javascript:
οnclick=javascript:openItemTable00(2);this.blur();>政策法规</a><
/td></tr>/n";
item00_view[6]=" <tr><td
class=childlink></td></tr>/n";
item00_view[7]="</table>/n";
var item00_all="";
for(i=0;i<item00_view.length;i++) item00_all+=item00_view[i];
</script> <script language=javascript>
function closeTopTree()
{ for(i=0;i<topTreeTable.cells.length/2;i++) {
topTreeTable.cells[2*i+1].innerHTML=""; treeImg[i].src="list.gif"; }
}
function openTopTree(n)
{ if(topTreeTable.cells[2*n+1].innerHTML=="") { closeTopTree();
treeImg[n].src="list2.gif"; switch(n) { case 0 :
{topTreeTable.cells[2*n+1].innerHTML=item00_all;break;} case 1 :
{topTreeTable.cells[2*n+1].innerHTML=item01_all;break;} case 2 :
{topTreeTable.cells[2*n+1].innerHTML=item02_all;break;} } } else
closeTopTree();
}
</script> </p> <div align="center"> <table
id=topTreeTable style="border-collapse: collapse; background-repeat:
repeat-y; background-position-x: 0px" height="100" class="z1">
<tr> <td><img name=treeImg src=list.gif border=0
width="10" height="13"><a id=top1 href=#none
onClick="openTopTree(0);">顶层一</a></td> </tr>
<tr> <td></td> </tr> <tr>
<td><img name=treeImg src=list.gif border=0 width="10"
height="13"><a href=#none
onClick="openTopTree(1);">顶层二</a></td> </tr>
<tr> <td></td> </tr> <tr>
<td><img name=treeImg src=list.gif border=0 width="10"
height="13"><a href=#none
onClick="openTopTree(2);">顶层三</a></td> </tr>
<tr> <td></td> </tr> </table>
</div> </td> </tr>
</table>
<p> </p>
</body>
</html>

提示：你可以先修改部分代码再运行

背景快速闪烁

脚本说明:
第一步:把如下代码加入<head>区域中
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>

第二步:把<body>中的内容改为:
<body bgcolor="#fef4d9" onLoad="fadeIn(16)">

提示：你可以先修改部分代码再运行

背景不停变化

脚本说明:
第一步:把如下代码加入<body>区域中
<SCRIPT language=javascript>
</SCRIPT>

第二步:把<body>改为
<body bgColor=#ffffff οnlοad="chgCol(); pingpong();">

提示：你可以先修改部分代码再运行

跟随鼠标旋转背景

脚本说明:
把如下代码加入<body>区域中
<LAYER NAME="a0" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ffffff" CLIP="0,0,1,1"></LAYER>
<LAYER NAME="a1" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#fff000" CLIP="0,0,1,1"></LAYER>
<LAYER NAME="a2" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ffa000" CLIP="0,0,1,1"></LAYER>
<LAYER NAME="a3" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ff00ff" CLIP="0,0,1,1"></LAYER>
<LAYER NAME="a4" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#00ff00" CLIP="0,0,1,1"></LAYER>
<LAYER NAME="a5" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#FF00FF" CLIP="0,0,1,1"></LAYER>
<LAYER NAME="a6" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#FF0000" CLIP="0,0,1,1"></LAYER>
<LAYER NAME="a7" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ffffff" CLIP="0,0,2,2"></LAYER>
<LAYER NAME="a8" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#fff000" CLIP="0,0,2,2"></LAYER>
<LAYER NAME="a9" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ffa000" CLIP="0,0,2,2"></LAYER>
<LAYER NAME="a10" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ff00ff" CLIP="0,0,2,2"></LAYER>
<LAYER NAME="a11" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#00ff00" CLIP="0,0,2,2"></LAYER>
<LAYER NAME="a12" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#0000ff" CLIP="0,0,2,2"></LAYER>
<LAYER NAME="a13" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#FF0000" CLIP="0,0,3,3"></LAYER>
<div id="starsDiv" style="position:absolute;top:0px;left:0px">
<div style="position:relative;width:1px;height:1px;background:#ffffff;font-size:1px;visibility:visible"></div>
<div style="position:relative;width:1px;height:1px;background:#fff000;font-size:1px;visibility:visible"></div>
<div style="position:relative;width:1px;height:1px;background:#ffa000;font-size:1px;visibility:visible"></div>
<div style="position:relative;width:1px;height:1px;background:#ff00ff;font-size:1px;visibility:visible"></div>
<div style="position:relative;width:1px;height:1px;background:#00ff00;font-size:1px;visibility:visible"></div>
<div style="position:relative;width:1px;height:1px;background:#0000ff;font-size:1px;visibility:visible"></div>
<div style="position:relative;width:1px;height:1px;background:#FF0000;font-size:1px;visibility:visible"></div>
<div style="position:relative;width:2px;height:2px;background:#ffffff;font-size:2px;visibility:visible"></div>
<div style="position:relative;width:2px;height:2px;background:#fff000;font-size:2px;visibility:visible"></div>
<div style="position:relative;width:2px;height:2px;background:#ffa000;font-size:2px;visibility:visible"></div>
<div style="position:relative;width:2px;height:2px;background:#ff00ff;font-size:2px;visibility:visible"></div>
<div style="position:relative;width:2px;height:2px;background:#00ff00;font-size:2px;visibility:visible"></div>
<div style="position:relative;width:2px;height:2px;background:#0000ff;font-size:2px;visibility:visible"></div>
<div style="position:relative;width:3px;height:3px;background:#FF0000;font-size:3px;visibility:visible"></div>
</div>
<SCRIPT LANGUAGE="JavaScript">

</script>

提示：你可以先修改部分代码再运行

<script language="javascript"> /****************************************************************************** Crossday Discuz! Board - Common Modules for Discuz! Modified by: Crossday Studio (http://crossday.com) Based upon: http://www.cnzzz.com *******************************************************************************/ tPopWait=30; showPopStep=20; popOpacity=80; sPop=null; curShow=null; tFadeOut=null; tFadeIn=null; tFadeWaiting=null; document.write(" "); document.write("

"); function showPopupText(){ var o=event.srcElement; MouseX=event.x; MouseY=event.y; if(o.alt!=null && o.alt!="") { o.pop=o.alt;o.alt="" } if(o.title!=null && o.title!=""){ o.pop=o.title;o.title="" } if(o.pop) { o.pop=o.pop.replace("/n","
"); o.pop=o.pop.replace("/n","
"); } if(o.pop!=sPop) { sPop=o.pop; clearTimeout(curShow); clearTimeout(tFadeOut); clearTimeout(tFadeIn); clearTimeout(tFadeWaiting); if(sPop==null || sPop=="") { popLayer.innerHTML=""; popLayer.style.filter="Alpha()"; popLayer.filters.Alpha.opacity=0; } else { if(o.dyclass!=null) popStyle=o.dyclass else popStyle="cPopText"; curShow=setTimeout("showIt()",tPopWait); } } } function showIt() { popLayer.className=popStyle; popLayer.innerHTML=sPop; popWidth=popLayer.clientWidth; popHeight=popLayer.clientHeight; if(MouseX+12+popWidth>document.body.clientWidth) popLeftAdjust=-popWidth-24 else popLeftAdjust=0; if(MouseY+12+popHeight>document.body.clientHeight) popTopAdjust=-popHeight-24 else popTopAdjust=0; popLayer.style.left=MouseX+12+document.body.scrollLeft+popLeftAdjust; popLayer.style.top=MouseY+12+document.body.scrollTop+popTopAdjust; popLayer.style.filter="Alpha(Opacity=0)"; fadeOut(); } function fadeOut(){ if(popLayer.filters.Alpha.opacity < form.elements.length; i++) { var e = form.elements[i]; if (e.name != 'chkall') { e.checked = form.chkall.checked; } } } function findobj(n, d) { var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0 && parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p); } if(!(x=d[n])&&d.all) { x=d.all[n]; } for(i=0;!x && i d.layers.length;i++) { x=MM_findObj(n,d.layers[i].document); } return x; } function copyCode(obj) { var rng = document.body.createTextRange(); rng.moveToElementText(obj); rng.scrollIntoView(); rng.select(); rng.execCommand("Copy"); rng.collapse(false); } function runCode(obj) { var winname = window.open('', "_blank", ''); winname.document.open('text/html', 'replace'); winname.document.writeln(obj.value); winname.document.close(); } function saveCode(obj) { var winname = window.open('', '_blank', 'top=10000'); winname.document.open('text/html', 'replace'); winname.document.writeln(obj.value); winname.document.execCommand('saveas','','code.htm'); winname.close(); } document.οnmοuseοver=showPopupText; </script>

Jofee

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
js一些常见的问题与解决代码(转自www.51js.com)

判断一个层是否被隐藏？例如，如果某一个层是被隐藏的就弹出＂你好＂的新窗口a 提示：你可以先修改部分代码再运行如何做网站中滚动的文字，还带超链接51js 提示：你可以先修改部分代码再运行如何在javascript中使表单中的一
复制链接

扫一扫

专栏目录