根据以前的状态收缩和扩展菜单 [英] contract and expand menus based on the previous state
问题描述
我不知道我做错了什么，我试图让菜单按照以前的状态扩展或收缩，即如果已经
如果再次点击合同，
扩展，如果签约，则展开，到目前为止它没有
不适用于about和services链接（但适用于扩展所有
和合同所有链接），任何帮助将不胜感激：
<！DOCTYPE HTML PUBLIC" - // W3C // DTD HTML 4.01 Transitional // EN"
" http：//www.w3.org/TR/html4/loose.dtd">
< html>
< head>
< meta http-equiv =" content-type"含量=" text / html的;字符集= ISO-8859-1" />
< title>欢迎< / title>
< link rel =" stylesheet" type =" text / css"
href =" style.css" />
< script type =" text / javascript" src =" simpletreemenu.js">
< / script>
< / head>
< div id =" ; wrapper">
< div id =" header">
< / div>
< table id =" table">
< tr>
< td id =" empty">< / td>
< td rowspan =" 2" id =" content">
< / td>
< / tr>
< tr>
< td id =" menu">
补充工具栏
< h4>菜单< / h4>
< a href =" javascript ：ddtreemenu.flatten（''treemenu1''，''expand''）">展开
全部< / a | < a href =" javascript ：ddtreemenu.flatten（''treemenu1''，
''contact''）"> Contract All< / a>
< ul id =" treemenu1" class =" treeview">
< li>主页< / li>
< li>< a href =" javascript ：ddtreemenu.flatten（''treemenu1abou t''，
''contact''）">关于< / a>
< ul id = " treemenu1about">
< li>历史< / li>
< li>工作机会< / li>
< ; / ul>
< / li>
< li>< a href =" javascript ：ddtreemenu.flatten（' 'treemenu1serv''，
''联系''）">服务< / a>
< ul id =" treemenu1services">
< li>虚拟助理< / li>
< li>网站设计和促销
< ul>
< li>网站设计< / li>
< li>搜索引擎优化< / li>
< li>网站推广< / li>
< liWebsite hosting< / li>
< / ul>
& lt; / li>
< / ul>
< / li>
< li> ; Faq< / li>
< li>联系< / li>
< / ul>
< / td>
< / tr>
< / table>
< / div>
< / div>
< / body>
< / html>
I don''t know what it is I am doing wrong, I am trying to get the menus to
either expand or contract based on their previous states, i.e if already
expanded if clicked again contract, and if contracted, expand, so far it
doesn''t work for the about and services link(but works for the expand all
and contract all links), any help would be greatly appreciated:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Welcome </title>
<link rel="stylesheet" type="text/css"
href="style.css" />
<script type="text/javascript" src="simpletreemenu.js">
</script>
</head>
<div id="wrapper">
<div id="header">
</div>
<table id="table">
<tr>
<td id="empty"></td>
<td rowspan="2" id="content">
</td>
</tr>
<tr>
<td id="menu">
Sidebar
<h4>Menu</h4>
<a href="javascript:ddtreemenu.flatten(''treemenu1'', ''expand'')">Expand
All</a| <a href="javascript:ddtreemenu.flatten(''treemenu1'',
''contact'')">Contract All</a>
<ul id="treemenu1" class="treeview">
<li>Home</li>
<li><a href="javascript:ddtreemenu.flatten(''treemenu1abou t'',
''contact'')">About</a>
<ul id="treemenu1about">
<li>History</li>
<li>Job opportunities</li>
</ul>
</li>
<li><a href="javascript:ddtreemenu.flatten(''treemenu1serv ices'',
''contact'')">Services</a>
<ul id="treemenu1services">
<li>Virtual assistants</li>
<li>Website design and promotion
<ul>
<li>Website design</li>
<li>Search engine optimisation</li>
<li>Website promotion </li>
<liWebsite hosting</li>
</ul>
</li>
</ul>
</li>
<li>Faq</li>
<li>Contact</li>
</ul>
</td>
</tr>
</table>
</div>
</div>
</body>
</html>
推荐答案
" Nospam" < no **** @ home.comwrote在
新闻：YJ **************** @ newsfe1-gui.ntli.net:
"Nospam" <no****@home.comwrote in
news:YJ****************@newsfe1-gui.ntli.net:
我不知道它是什么我做错了，我想把菜单
扩展或收缩基于他们以前的状态，即如果再次点击合同已经扩大了，如果签约，则展开，
到目前为止它并不适用于约和服务链接（但适用于
展开全部并收缩所有链接），任何帮助都会非常好
赞赏：
I don''t know what it is I am doing wrong, I am trying to get the menus
to either expand or contract based on their previous states, i.e if
already expanded if clicked again contract, and if contracted, expand,
so far it doesn''t work for the about and services link(but works for
the expand all and contract all links), any help would be greatly
appreciated:
如果你不发布任何
javascript，那就很难调试你的javascript问题。
its awfully hard to debug your javascript problem if you don''t post any
javascript.
simpletreemenu中的javascript是：
var persisteduls = new Object（）
var ddtreemenu = new Object（）
ddtreemenu.closefolder =" / includes / closed .gif要点" //将图片路径设置为已关闭
文件夹图片
ddtreemenu.openfolder =" /includes/open.gif" //将图片路径设置为打开文件夹
image
//////////这里不需要编辑//////////////// ///////////
ddtreemenu.createTree = function（treeid，enablepersist，persistdays）{
var ultags = document.getElementById（treeid）。 getElements ByTagName（" ul"）
if（typeof persisteduls [treeid] ==" undefined"）
persisteduls [treeid] =（enablepersist == true& &
ddtreemenu.getCookie（treeid）！=""）？ ddtreemenu.getCookie（treeid）.split（"，"）：
""
for（var i = 0; i< ultags.length; i ++ ）
ddtreemenu.buildSubTree（treeid，ultags [i]，i）
if（enablepersist == true）{// if enable persist feature
var durationdays =（typeof persistdays ==" undefined"）？ 1：
parseInt（persistdays）
ddtreemenu.dotask（window，function（）{ddtreemenu.rememberstate（treeid，
durationdays）}， 卸载）//在正文卸载时保存已打开的UL索引
}
}
ddtreemenu.buildSubTree = function（ treeid，ulelement，index）{
ulelement.parentNode.className =" submenu"
if（typeof persisteduls [treeid] ==" object"）{//如果cookie存在
（persisteduls [treeid]是一个数组而不是&;字符串）
if（ddtreemenu.searcharray（persisteduls [treeid]，index））{
ulelement.setAttribute（" rel"，" open"）
ulelement.style.display =" block"
ulelement.parentNode .style.backgroundImage =" url（" + ddtreemenu.openfolder +"）"
}
else
ulelement.setAttribute（" rel"，" closed"）
} //结束cookie持久代码
else if （ulelement.getAttribute（" rel"）== null ||
ulelement.getAttribute（" rel"）== false）//如果没有cookie且UL没有相关信息
属性已被用户添加
ulelement.setAttribute（" rel"，" closed"）
else if（ulelement.getAttribute（" rel" ）==" open"）//否则，如果没有cookie，这个
UL的显式rel值为open
ddtreemenu.expandSubTree（treeid，ulelement） ）//展开这个UL加上所有的父母
ULs（所以最内层的UL被揭晓！）
ulelement.parentNode.onclick = function（e）{
var submenu = this.getElementsByTagName（" ul"）[0]
if（submenu.getAttribute（" rel"）==" closed"）{
submenu.style.display =" block"
submenu.setAttribute（" rel"，" open"）
ulelement.parentNode.style .backgroundImage =" url（" + ddtreemenu.openfolder +"）"
}
else if（submenu.getAttribute（" rel"）==" open"）{
submenu.style.display =" none" ;
submenu.setAttribute（" rel"，" closed"）
ulelement.parentNode.style.backgroundImage =" url（" + ddtreemenu.closefolder + ）*
"
}
ddtreemenu.preventpropagate（e）
}
ulelement.onclick = function（e）{
ddtreemenu.preventpropagate（e）
}
}
ddtreemenu.expandSubTree = function（treeid，ulelement）{//扩展UL元素
及其任何父级UL
var rootnode = document.getElementById（treeid）
var currentnode = ulelement
currentnode.style.display =" block"
currentnode.parentNode .style.backgroundImage =" url（" + ddtreemenu.openfolder +" *
）
"
while（currentnode！ = rootnode）{
if（currentnode.tag名称==" UL"）{//如果父节点是UL，则展开它
currentnode.style.display =" block"
currentnode.setAttribute （rel，打开）//表示它已打开
currentnode.parentNode.style.backgroundImage =" url（" + ddtreemenu.openfolder +" * < br $> b $ b）
"
}
currentnode = currentnode.parentNode
}
}
ddtreemenu.flatten = function（treeid，action）{//扩展或收缩所有UL
元素
var ultags = document.getElementById（treeid）.getElements ByTagName（" ul"）
for（var i = 0; I< ultags.length; i ++）{
ultags [i] .style.display =（action ==" expand"）？ "块" ：" none"
var relvalue =（action ==" expand"）？ "开" ：关闭
ultags [i] .setAttribute（" rel"，relvalue）
ultags [i] .parentNode.style.backgroundImage =（action == expand）？
" url（" + ddtreemenu.openfolder +"）" ：" url（" + ddtreemenu.closefolder +"）"
}
}
ddtreemenu.rememberstate = function（treeid ，durationdays）{//存储索引
打开UL相对于树中的其他UL到cookie中
var ultags = document.getElementById（treeid）.getElements ByTagName（" ul"）
var openuls = new Array（）
for（var i = 0; i< ultags.length; i ++）{
if（ultags [i] .getAttribute（" rel"）==" open"）
openuls [openuls.length] = i //保存已打开UL的索引（相对于
整个UL列表）作为数组元素
}
if（openuls.length == 0）// if没有打开的UL来保存/坚持
openuls [0] =" none open" //将数组值设置为字符串以简单地指示所有
UL应该在状态关闭时保持不变
ddtreemenu.setCookie（treeid，openuls.join（"，"） ，durationdays）//填充
cookie，其值为treeid = 1,2,3等（其中1,2 ...是
打开UL的索引）< br $>
}
////以下几个实用功能//////////////////////
ddtreemenu.getCookie = function（Name）{//获取cookie值
var re = new RegExp（Name +" = [^;] +"， " I"）; //构造RE以搜索目标
名称/值对
if（document.cookie.match（re））//如果找到cookie
return document.cookie.match（re）[0] .split（" ="）[1] //返回其值
return""
}
ddtreemenu.setCookie = function（name，value，days）{//设置cookei值
var expireDate = new Date（）
// set" expstring"到期日或过去的日期，设置或删除cookie，分别为
var expstring = expireDate.setDate（expireDate.getDate（）+ parseInt（days））
document.cookie = name +" =" + value +" ;; expires =" + expireDate.toGMTString（）+" ;;
path = /" ;;
}
ddtreemenu.searcharray = function （thearray，value）{//在数组中搜索
输入的值。如果找到，则从数组中删除值
var isfound = false
for（var i = 0; i< thearray.length; i ++）{
if（thearray [i] == value）{
isfound = true
thearray.shift（）//为了提高效率，从数组中删除此元素
休息
}
}
返回isfound
}
ddtreemenu.preventpropagate = function（e）{//阻止冒泡行动
向上
if（typeof e！=" undefined"）
e.stopPropagation（）
else
event.cancelBubble = true
}
ddtreemenu.dotask = function （target，functionref，tasktype）{//分配一个
函数来执行事件处理程序（即：onunload）
var tasktype =（window.addEventListener）？ tasktype：" on" + tasktype
if（target.addEventListener）
target.addEventListener（tasktype，functionref，false）
else if （target.attachEvent）
target.attachEvent（tasktype，functionref）
The javascript in simpletreemenu is:
var persisteduls=new Object()
var ddtreemenu=new Object()
ddtreemenu.closefolder="/includes/closed.gif" //set image path to "closed"
folder image
ddtreemenu.openfolder="/includes/open.gif" //set image path to "open" folder
image
//////////No need to edit beyond here///////////////////////////
ddtreemenu.createTree=function(treeid, enablepersist, persistdays){
var ultags=document.getElementById(treeid).getElements ByTagName("ul")
if (typeof persisteduls[treeid]=="undefined")
persisteduls[treeid]=(enablepersist==true &&
ddtreemenu.getCookie(treeid)!="")? ddtreemenu.getCookie(treeid).split(",") :
""
for (var i=0; i<ultags.length; i++)
ddtreemenu.buildSubTree(treeid, ultags[i], i)
if (enablepersist==true){ //if enable persist feature
var durationdays=(typeof persistdays=="undefined")? 1 :
parseInt(persistdays)
ddtreemenu.dotask(window, function(){ddtreemenu.rememberstate(treeid,
durationdays)}, "unload") //save opened UL indexes on body unload
}
}
ddtreemenu.buildSubTree=function(treeid, ulelement, index){
ulelement.parentNode.className="submenu"
if (typeof persisteduls[treeid]=="object"){ //if cookie exists
(persisteduls[treeid] is an array versus "" string)
if (ddtreemenu.searcharray(persisteduls[treeid], index)){
ulelement.setAttribute("rel", "open")
ulelement.style.display="block"
ulelement.parentNode.style.backgroundImage="url("+ ddtreemenu.openfolder+")"
}
else
ulelement.setAttribute("rel", "closed")
} //end cookie persist code
else if (ulelement.getAttribute("rel")==null ||
ulelement.getAttribute("rel")==false) //if no cookie and UL has NO rel
attribute explicted added by user
ulelement.setAttribute("rel", "closed")
else if (ulelement.getAttribute("rel")=="open") //else if no cookie and this
UL has an explicit rel value of "open"
ddtreemenu.expandSubTree(treeid, ulelement) //expand this UL plus all parent
ULs (so the most inner UL is revealed!)
ulelement.parentNode.onclick=function(e){
var submenu=this.getElementsByTagName("ul")[0]
if (submenu.getAttribute("rel")=="closed"){
submenu.style.display="block"
submenu.setAttribute("rel", "open")
ulelement.parentNode.style.backgroundImage="url("+ ddtreemenu.openfolder+")"
}
else if (submenu.getAttribute("rel")=="open"){
submenu.style.display="none"
submenu.setAttribute("rel", "closed")
ulelement.parentNode.style.backgroundImage="url("+ ddtreemenu.closefolder+")*
"
}
ddtreemenu.preventpropagate(e)
}
ulelement.onclick=function(e){
ddtreemenu.preventpropagate(e)
}
}
ddtreemenu.expandSubTree=function(treeid, ulelement){ //expand a UL element
and any of its parent ULs
var rootnode=document.getElementById(treeid)
var currentnode=ulelement
currentnode.style.display="block"
currentnode.parentNode.style.backgroundImage="url( "+ddtreemenu.openfolder+"*
)
"
while (currentnode!=rootnode){
if (currentnode.tagName=="UL"){ //if parent node is a UL, expand it too
currentnode.style.display="block"
currentnode.setAttribute("rel", "open") //indicate it''s open
currentnode.parentNode.style.backgroundImage="url( "+ddtreemenu.openfolder+"*
)
"
}
currentnode=currentnode.parentNode
}
}
ddtreemenu.flatten=function(treeid, action){ //expand or contract all UL
elements
var ultags=document.getElementById(treeid).getElements ByTagName("ul")
for (var i=0; i<ultags.length; i++){
ultags[i].style.display=(action=="expand")? "block" : "none"
var relvalue=(action=="expand")? "open" : "closed"
ultags[i].setAttribute("rel", relvalue)
ultags[i].parentNode.style.backgroundImage=(action=="expand ")?
"url("+ddtreemenu.openfolder+")" : "url("+ddtreemenu.closefolder+")"
}
}
ddtreemenu.rememberstate=function(treeid, durationdays){ //store index of
opened ULs relative to other ULs in Tree into cookie
var ultags=document.getElementById(treeid).getElements ByTagName("ul")
var openuls=new Array()
for (var i=0; i<ultags.length; i++){
if (ultags[i].getAttribute("rel")=="open")
openuls[openuls.length]=i //save the index of the opened UL (relative to the
entire list of ULs) as an array element
}
if (openuls.length==0) //if there are no opened ULs to save/persist
openuls[0]="none open" //set array value to string to simply indicate all
ULs should persist with state being closed
ddtreemenu.setCookie(treeid, openuls.join(","), durationdays) //populate
cookie with value treeid=1,2,3 etc (where 1,2... are the indexes of the
opened ULs)
}
////A few utility functions below//////////////////////
ddtreemenu.getCookie=function(Name){ //get cookie value
var re=new RegExp(Name+"=[^;]+", "i"); //construct RE to search for target
name/value pair
if (document.cookie.match(re)) //if cookie found
return document.cookie.match(re)[0].split("=")[1] //return its value
return ""
}
ddtreemenu.setCookie=function(name, value, days){ //set cookei value
var expireDate = new Date()
//set "expstring" to either future or past date, to set or delete cookie,
respectively
var expstring=expireDate.setDate(expireDate.getDate()+ parseInt(days))
document.cookie = name+"="+value+"; expires="+expireDate.toGMTString()+";
path=/";
}
ddtreemenu.searcharray=function(thearray, value){ //searches an array for
the entered value. If found, delete value from array
var isfound=false
for (var i=0; i<thearray.length; i++){
if (thearray[i]==value){
isfound=true
thearray.shift() //delete this element from array for efficiency sake
break
}
}
return isfound
}
ddtreemenu.preventpropagate=function(e){ //prevent action from bubbling
upwards
if (typeof e!="undefined")
e.stopPropagation()
else
event.cancelBubble=true
}
ddtreemenu.dotask=function(target, functionref, tasktype){ //assign a
function to execute to an event handler (ie: onunload)
var tasktype=(window.addEventListener)? tasktype : "on"+tasktype
if (target.addEventListener)
target.addEventListener(tasktype, functionref, false)
else if (target.attachEvent)
target.attachEvent(tasktype, functionref)
Nospam在2007年6月16日下午3:02发表以下内容：
Nospam said the following on 6/16/2007 3:02 PM:
simpletreemenu中的javascript是：
The javascript in simpletreemenu is:
那里有问题，或者你只是发布代码为
它的乐趣？
-
兰迪
机会有利于准备好的心灵
comp.lang.javascript常见问题 - http：/ /jibbering.com/faq/index.html
Javascript最佳实践 - http://www.JavascriptToolbox.com/bestpractices/
这篇关于根据以前的状态收缩和扩展菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
