JavaScript问题
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JavaScript问题相关的知识,希望对你有一定的参考价值。
在ASP中怎么用javascript做出目录式菜单的效果
就是在导航条里的链接文字,当鼠标移上去的时候就出在其下方出现下一级目录.
请各位大哥说一说思路,如果有代码更好
小弟在此先谢过了
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>非常棒的绿色下拉透明菜单</title>
</head>
<body>
<script language="JavaScript">
var mmenus = new Array();
var misShow = new Boolean();
misShow=false;
var misdown = new Boolean();
misdown=false;
var mnumberofsub=0;
var musestatus=false;
var mpopTimer = 0;
mmenucolor=\'#89CB10\';mfontcolor=\'MenuText\';mmenuoutcolor=\'#ADEF34\';mmenuincolor=\'#B5E74E\';mmenuoutbordercolor=\'#ECFA3A\';mmenuinbordercolor=\'#5A2614\';mmidoutcolor=\'#A9DA1D\';mmidincolor=\'#799310\';mmenuovercolor=\'#004080\';mitemedge=\'0\';msubedge=\'1\';mmenuunitwidth=66;mmenuitemwidth=140;mmenuheight=25;mmenuwidth=\'100%\';mmenuadjust=0;mmenuadjustV=0;mfonts=\'font-family: 宋体; font-size: 9pt; color: MenuText; \';mcursor=\'hand\';
var swipeSteps = 4;
var swipemsec = 25;
var swipeArray = new Array();
function swipe(el, dir, steps, msec)
if (steps == null) steps = swipeSteps;
if (msec == null) msec = swipemsec;
if (el.swipeIndex == null)
el.swipeIndex = swipeArray.length;
if (el.swipeTimer != null)
window.clearTimeout(el.swipeTimer);
swipeArray[el.swipeIndex] = el;
el.style.clip = "rect(-99999, 99999, 99999, -99999)";
if (el.swipeCounter == null || el.swipeCounter == 0)
el.orgLeft = el.offsetLeft;
el.orgTop = el.offsetTop;
el.orgWidth = el.offsetWidth;
el.orgHeight = el.offsetHeight;
el.swipeCounter = steps;
el.style.clip = "rect(0,0,0,0)";
window.setTimeout("repeat(" + dir + "," + el.swipeIndex + "," + steps + "," + msec + ")", msec);
function repeat(dir, index, steps, msec)
el = swipeArray[index];
var left = el.orgLeft;
var top = el.orgTop;
var width = el.orgWidth;
var height = el.orgHeight;
if (el.swipeCounter == 0)
el.style.clip = "rect(-99999, 99999, 99999, -99999)";
return;
else
el.swipeCounter--;
el.style.visibility = "visible";
switch (dir)
case 2:
el.style.clip = "rect(" + height*el.swipeCounter/steps + "," + width + "," + height + "," + 0 + ")";
el.style.top = top - height*el.swipeCounter/steps;
break;
case 8:
el.style.clip = "rect(" + 0 + "," + width + "," + height*(steps-el.swipeCounter)/steps + "," + 0 + ")";
el.style.top = top + height*el.swipeCounter/steps;
break;
case 6:
el.style.clip = "rect(" + 0 + "," + width + "," + height + "," + width*(el.swipeCounter)/steps + ")";
el.style.left = left - width*el.swipeCounter/steps;
break;
case 4:
el.style.clip = "rect(" + 0 + "," + width*(swipeSteps - el.swipeCounter)/steps + "," + height + "," + 0 + ")";
el.style.left = left + width*el.swipeCounter/steps;
break;
el.swipeTimer = window.setTimeout("repeat(" + dir + "," + index + "," + steps + "," + msec + ")", msec);
var mtmpleft="";
var mtmptop="";
function hideSwipe(el)
window.clearTimeout(el.swipeTimer);
el.style.visibility = "hidden";
el.style.clip = "rect(-99999, 99999, 99999, -99999)";
el.swipeCounter = 0;
if(mtmpleft!="")el.style.left = mtmpleft;
if(mtmptop!="")el.style.top = mtmptop;
function stoperror()
return true;
window.onerror=stoperror;
function mpopOut()
mpopTimer = setTimeout(\'mallhide()\', 500);
function getReal(el, type, value)
temp = el;
while ((temp != null) && (temp.tagName != "BODY"))
if (eval("temp." + type) == value)
el = temp;
return el;
temp = temp.parentElement;
return el;
function mMenuRegister(menu)
mmenus[mmenus.length] = menu
return (mmenus.length - 1)
function mMenuItem(caption,command,target,isline,statustxt,level,img,sizex,sizey,pos)
this.items = new Array();
this.caption=caption;
this.command=command;
this.target=target;
this.isline=isline;
this.statustxt=statustxt;
if(level!=null)mnumberofsub++;
this.hasc=mnumberofsub;
this.level=level;
this.img=img;
this.sizex=sizex;
this.sizey=sizey;
this.pos=pos;
function mMenu(caption,command,target,img,sizex,sizey,pos)
this.items = new Array();
this.caption=caption;
this.command=command;
this.target=target;
this.img=img;
this.sizex=sizex;
this.sizey=sizey;
this.pos=pos;
this.id=mMenuRegister(this);
function mMenuAddItem(item)
this.items[this.items.length] = item
item.parent = this.id;
this.children=true;
mMenu.prototype.addItem = mMenuAddItem;
mMenuItem.prototype.addsubItem = mMenuAddItem;
function mtoout(src)
src.style.borderLeftColor=mmenuoutbordercolor;
src.style.borderRightColor=mmenuinbordercolor;
src.style.borderTopColor=mmenuoutbordercolor;
src.style.borderBottomColor=mmenuinbordercolor;
src.style.backgroundColor=mmenuoutcolor;
src.style.color=mmenuovercolor;
function mtoin(src)
src.style.borderLeftColor=mmenuinbordercolor;
src.style.borderRightColor=mmenuoutbordercolor;
src.style.borderTopColor=mmenuinbordercolor;
src.style.borderBottomColor=mmenuoutbordercolor;
src.style.backgroundColor=mmenuincolor;
src.style.color=mmenuovercolor;
function mnochange(src)
src.style.borderLeftColor=mmenucolor;
src.style.borderRightColor=mmenucolor;
src.style.borderTopColor=mmenucolor;
src.style.borderBottomColor=mmenucolor;
src.style.backgroundColor=\'\';
src.style.color=mfontcolor;
function mallhide()
for(var nummenu=0;nummenu<mmenus.length;nummenu++)
var themenu=document.all[\'mMenu\'+nummenu]
var themenudiv=document.all[\'mmenudiv\'+nummenu]
mnochange(themenu);
mmenuhide(themenudiv);
for(nummenu=1;nummenu<=mnumberofsub;nummenu++)
var thesub=document.all[\'msubmenudiv\'+nummenu]
msubmenuhide(thesub);
mnochange(document.all[\'mp\'+nummenu]);
document.all["mitem"+nummenu].style.color=mfontcolor;
function mmenuhide(menuid)
menuid.style.filter=\'Alpha(Opacity=100)\';
hideSwipe(menuid);
misShow=false;
function msubmenuhide(menuid)
menuid.style.filter=\'Alpha(Opacity=100)\';
menuid.style.visibility=\'hidden\';
function mmenushow(menuid,pid)
menuid.style.filter=\'Alpha(Opacity=80)\';
menuid.style.left=mposflag.offsetLeft+pid.offsetLeft+mmenuadjust;menuid.style.top=mposflag.offsetTop+mmenutable.offsetHeight+mmenuadjustV;
if(mmenuitemwidth+parseInt(menuid.style.left)>document.body.clientWidth+document.body.scrollLeft)
menuid.style.left=document.body.clientWidth+document.body.scrollLeft-mmenuitemwidth;
mtmpleft=menuid.style.left;mtmptop=menuid.style.top;swipe(menuid,2,4);
misShow=true;
function mshowsubmenu(menuid,pid,rid)
menuid.style.filter=\'Alpha(Opacity=80)\';
menuid.style.left=pid.offsetWidth+rid.offsetLeft;
menuid.style.top=pid.offsetTop+rid.offsetTop-3;
if(mmenuitemwidth+parseInt(menuid.style.left)>document.body.clientWidth+document.body.scrollLeft)
menuid.style.left=document.body.clientWidth+document.body.scrollLeft-mmenuitemwidth;
menuid.style.visibility=\'visible\';
function mmenu_over(menuid,x)
toel = getReal(window.event.toElement, "className", "coolButton");
fromel = getReal(window.event.fromElement, "className", "coolButton");
if (toel == fromel) return;
if(x<0)
misShow = false;
mallhide();
mtoout(eval("mMenu"+x));
else
mallhide();
mtoin(eval("mMenu"+x));
mmenushow(menuid,eval("mMenu"+x));
clearTimeout(mpopTimer);
function mmenu_out(x)
toel = getReal(window.event.toElement, "className", "coolButton");
fromel = getReal(window.event.fromElement, "className", "coolButton");
if (toel == fromel) return;
if (misShow)
mtoin(eval("mMenu"+x));
else
mnochange(eval("mMenu"+x));
mpopOut()
function mmenu_down(menuid,x)
if(misShow)
mmenuhide(menuid);
mtoout(eval("mMenu"+x));
else
mtoin(eval("mMenu"+x));
mmenushow(menuid,eval("mMenu"+x));
misdown=true;
function mmenu_up()
misdown=false;
function mmenuitem_over(menuid,item,x,j,i)
toel = getReal(window.event.toElement, "className", "coolButton");
fromel = getReal(window.event.fromElement, "className", "coolButton");
if (toel == fromel) return;
srcel = getReal(window.event.srcElement, "className", "coolButton");
for(nummenu=1;nummenu<=mnumberofsub;nummenu++)
var thesub=document.all[\'msubmenudiv\'+nummenu]
if(!(menuid==thesub||menuid.style.tag>=thesub.style.tag))
msubmenuhide(thesub);
mnochange(document.all[\'mp\'+nummenu]);
document.all["mitem"+nummenu].style.color=mfontcolor;
if(item)document.all["mitem"+item].style.color=mmenuovercolor;
if(misdown||item)
mtoin(srcel);
else
mtoout(srcel);
if(x==-1)mthestatus=eval("msub"+j).items[i].statustxt;
if(j==-1)mthestatus=mmenus[x].items[i].statustxt;
if(mthestatus!="")
musestatus=true;
window.status=mthestatus;
clearTimeout(mpopTimer);
function mmenuitem_out(hassub)
toel = getReal(window.event.toElement, "className", "coolButton");
fromel = getReal(window.event.fromElement, "className", "coolButton");
if (toel == fromel) return;
srcel = getReal(window.event.srcElement, "className", "coolButton");
if(!hassub)mnochange(srcel);
if(musestatus)window.status="";
mpopOut()
function mmenuitem_down()
srcel = getReal(window.event.srcElement, "className", "coolButton");
mtoin(srcel)
misdown=true;
function mmenuitem_up()
srcel = getReal(window.event.srcElement, "className", "coolButton");
mtoout(srcel)
misdown=false;
function mexec3(j,i)
var cmd;
if(eval("msub"+j).items[i].target=="blank")
cmd = "window.open(\'"+eval("msub"+j).items[i].command+"\')";
else
cmd = eval("msub"+j).items[i].target+".location=\\""+eval("msub"+j).items[i].command+"\\"";
eval(cmd);
function mexec2(x)
var cmd;
if(mmenus[x].target=="blank")
cmd = "window.open(\'"+mmenus[x].command+"\')";
else
cmd = mmenus[x].target+".location=\\""+mmenus[x].command+"\\"";
eval(cmd);
function mexec(x,i)
var cmd;
if(mmenus[x].items[i].target=="blank")
cmd = "window.open(\'"+mmenus[x].items[i].command+"\')";
else
cmd = mmenus[x].items[i].target+".location=\\""+mmenus[x].items[i].command+"\\"";
eval(cmd);
function mbody_click()
if (misShow)
srcel = getReal(window.event.srcElement, "className", "coolButton");
for(var x=0;x<=mmenus.length;x++)
if(srcel.id=="mMenu"+x)
return;
for(x=1;x<=mnumberofsub;x++)
if(srcel.id=="mp"+x)
return;
mallhide();
document.onclick=mbody_click;
function mwritetodocument()
var mwb=1;
var stringx=\'<div id="mposflag" style="position:absolute;"></div><table id=mmenutable border=0 cellpadding=3 cellspacing=2 width=\'+mmenuwidth+\' height=\'+mmenuheight+\' bgcolor=\'+mmenucolor+
\' onselectstart="event.returnValue=false"\'+
\' style="filter:Alpha(Opacity=80);cursor:\'+mcursor+\';\'+mfonts+
\' border-left: \'+mwb+\'px solid \'+mmenuoutbordercolor+\';\'+
\' border-right: \'+mwb+\'px solid \'+mmenuinbordercolor+\'; \'+
\'border-top: \'+mwb+\'px solid \'+mmenuoutbordercolor+\'; \'+
\'border-bottom: \'+mwb+\'px solid \'+mmenuinbordercolor+\'; padding:0px"><tr>\'
for(var x=0;x<mmenus.length;x++)
var thismenu=mmenus[x];
var imgsize="";
if(thismenu.sizex!="0"||thismenu.sizey!="0")imgsize=" ";
if(thismenu.caption!="")ifspace=" ";
stringx += "<td nowrap class=coolButton id=mMenu"+x+" style=\'border: "+mitemedge+"px solid "+mmenucolor+
"\' px onmouseover=mmenu_over(mmenudiv"+x+
","+x+") onmouseout=mmenu_out("+x+
") onmousedown=mmenu_down(mmenudiv"+x+","+x+")";
if(thismenu.command!="")
stringx += " onmouseup=mmenu_up();mexec2("+x+");";
else
stringx += " onmouseup=mmenu_up()";
if(thismenu.pos=="0")
stringx += " align=center><img align=absmiddle src=\'"+thismenu.img+"\'"+imgsize+">"+ifspace+thismenu.caption+"</td>";
else if(thismenu.pos=="1")
stringx += " align=center>"+thismenu.caption+ifspace+"<img align=absmiddle src=\'"+thismenu.img+"\'"+imgsize+"></td>";
else if(thismenu.pos=="2")
stringx += " align=center background=\'"+thismenu.img+"\'> "+thismenu.caption+" </td>";
else
stringx += " align=center> "+thismenu.caption+" </td>";
stringx += "";
stringx+="<td width=*> </td></tr></table>";
for(var x=0;x<mmenus.length;x++)
thismenu=mmenus[x];
if(x<0)
stringx+=\'<div id=mmenudiv\'+x+\' style="visiable:none"></div>\';
else
stringx+=\'<div id=mmenudiv\'+x+
\' style="filter:Alpha(Opacity=80);cursor:\'+mcursor+\';position:absolute;\'+
\'width:\'+mmenuitemwidth+\'px; z-index:\'+(x+100);
if(mmenuinbordercolor!=mmenuoutbordercolor&&msubedge=="0")
stringx+=\';border-left: 1px solid \'+mmidoutcolor+
\';border-top: 1px solid \'+mmidoutcolor;
stringx+=\';border-right: 1px solid \'+mmenuinbordercolor+
\';border-bottom: 1px solid \'+mmenuinbordercolor+\';visibility:hidden" onselectstart="event.returnValue=false">\\n\'+
\'<table border="0" align="center" cellpadding="0" cellspacing="2" \'+
\'style="\'+mfonts+\' border-left: 1px solid \'+mmenuoutbordercolor;
if(mmenuinbordercolor!=mmenuoutbordercolor&&msubedge=="0")
stringx+=\';border-right: 1px solid \'+mmidincolor+
\';border-bottom: 1px solid \'+mmidincolor;
stringx+=\';border-top: 1px solid \'+mmenuoutbordercolor+
\';padding: 4px" bgcolor=\'+mmenucolor+\'>\\n\'
for(var i=0;i<thismenu.items.length;i++)
var thismenuitem=thismenu.items[i];
var imgsize="";
if(thismenuitem.sizex!="0"||thismenuitem.sizey!="0")imgsize=" ";
if(thismenu.caption!="")ifspace=" ";
if(thismenuitem.hasc!=null)
stringx += "<tr><td id=mp"+thismenuitem.hasc+" class=coolButton style=\'border: "+mitemedge+"px solid "+mmenucolor+
"\' width=100% onmouseout=mmenuitem_out(true) onmouseover=\\"mmenuitem_over(mmenudiv"+x+
",\'"+thismenuitem.hasc+"\',"+x+",-1,"+i+");mshowsubmenu(msubmenudiv"+thismenuitem.hasc+",mp"+thismenuitem.hasc+",mmenudiv"+x+");\\""+
"><table id=mitem"+thismenuitem.hasc+" cellspacing=\'0\' cellpadding=\'0\' border=\'0\' width=\'100%\' style=\'"+mfonts+"\'><tr><td ";
if(thismenuitem.pos=="0")
stringx += "><img align=absmiddle src=\'"+thismenuitem.img+"\'"+imgsize+">"+ifspace+thismenuitem.caption+"</td><td"; 参考技术A 直接用javascript做:http://www.baidu.com/s?wd=js+%B2%CB%B5%A5&cl=3
用Dreamweaver快速制作:http://www.baidu.com/s?ie=gb2312&bs=dw+%D6%C6%D7%F7%B2%CB%B5%A5&sr=&z=&cl=3&f=8&wd=dw+%D6%C6%D7%F7%CF%C2%C0%AD%B2%CB%B5%A5&ct=0
学会制作菜单了,再用asp动态生成菜单项就行了 参考技术B 找一些JS生成的小软件是比较快的方法
Javascript中 闭包问题
学习Javascript闭包(Closure)
闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现。
下面就是我的学习笔记,对于Javascript初学者应该是很有用的。
一、变量的作用域
要理解闭包,首先必须理解Javascript特殊的变量作用域。
变量的作用域无非就是两种:全局变量和局部变量。
Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量。
var n=999;
function f1(){
alert(n);
}
f1(); // 999
另一方面,在函数外部自然无法读取函数内的局部变量。
function f1(){
var n=999;
}
alert(n); // error
这里有一个地方需要注意,函数内部声明变量的时候,一定要使用var命令。如果不用的话,你实际上声明了一个全局变量!
function f1(){
n=999;
}
f1();
alert(n); // 999
二、如何从外部读取局部变量?
出于种种原因,我们有时候需要得到函数内的局部变量。但是,前面已经说过了,正常情况下,这是办不到的,只有通过变通方法才能实现。
那就是在函数的内部,再定义一个函数。
function f1(){
var n=999;
function f2(){
alert(n); // 999
}
}
在上面的代码中,函数f2就被包括在函数f1内部,这时f1内部的所有局部变量,对f2都是可见的。但是反过来就不行,f2内部的局部变量,对f1 就是不可见的。这就是Javascript语言特有的"链式作用域"结构(chain scope),子对象会一级一级地向上寻找所有父对象的变量。所以,父对象的所有变量,对子对象都是可见的,反之则不成立。
既然f2可以读取f1中的局部变量,那么只要把f2作为返回值,我们不就可以在f1外部读取它的内部变量了吗!
function f1(){
var n=999;
function f2(){
alert(n);
}
return f2;
}
var result=f1();
result(); // 999
三、闭包的概念
上一节代码中的f2函数,就是闭包。
各种专业文献上的"闭包"(closure)定义非常抽象,很难看懂。我的理解是,闭包就是能够读取其他函数内部变量的函数。
由于在Javascript语言中,只有函数内部的子函数才能读取局部变量,因此可以把闭包简单理解成"定义在一个函数内部的函数"。
所以,在本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁。
四、闭包的用途
闭包可以用在许多地方。它的最大用处有两个,一个是前面提到的可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中。
怎么来理解这句话呢?请看下面的代码。
function f1(){
var n=999;
nAdd=function(){n+=1}
function f2(){
alert(n);
}
return f2;
}
var result=f1();
result(); // 999
nAdd();
result(); // 1000
在这段代码中,result实际上就是闭包f2函数。它一共运行了两次,第一次的值是999,第二次的值是1000。这证明了,函数f1中的局部变量n一直保存在内存中,并没有在f1调用后被自动清除。
为什么会这样呢?原因就在于f1是f2的父函数,而f2被赋给了一个全局变量,这导致f2始终在内存中,而f2的存在依赖于f1,因此f1也始终在内存中,不会在调用结束后,被垃圾回收机制(garbage collection)回收。
这段代码中另一个值得注意的地方,就是"nAdd=function(){n+=1}"这一行,首先在nAdd前面没有使用var关键字,因此 nAdd是一个全局变量,而不是局部变量。其次,nAdd的值是一个匿名函数(anonymous function),而这个匿名函数本身也是一个闭包,所以nAdd相当于是一个setter,可以在函数外部对函数内部的局部变量进行操作。
五、使用闭包的注意点
1)由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄露。解决方法是,在退出函数之前,将不使用的局部变量全部删除。
2)闭包会在父函数外部,改变父函数内部变量的值。所以,如果你把父函数当作对象(object)使用,把闭包当作它的公用方法(Public Method),把内部变量当作它的私有属性(private value),这时一定要小心,不要随便改变父函数内部变量的值。
六、思考题
如果你能理解下面两段代码的运行结果,应该就算理解闭包的运行机制了。
代码片段一。
var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
return function(){
return this.name;
};
}
};
alert(object.getNameFunc()());//the window
代码片段二。
var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
var that = this;
return function(){
return that.name;
};
}
};
alert(object.getNameFunc()()); //my object;
转载于 阮一峰。
以上是关于JavaScript问题的主要内容,如果未能解决你的问题,请参考以下文章