菜单折叠

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">@import"hide.css";</style>
<script type="text/javascript" src="DOMhelp.js"></script>
<script type="text/javascript" src="zhedieneirong2.js"></script> <title>无标题文档</title>
</head><body><ul id="news">
<li>
<a href="#">first</a>
<p>aaaa</p>
</li>
<li>
<a href="#">second</a>
<p>bbbb</p>
</li>
<li>
<a href="#">third</a>
<p>aaaa</p>
</li>
</ul>
</body>
</html>news={
    hideclass:'hide',
    init:function(){
        var i,h1;
        var newslist=document.getElementById('news');
        var ps=newslist.getElementsByTagName('p');
        for(i=0;i<ps.length;i++){
            DOMhelp.cssjs('add',ps[i],news.hideclass);}
var newsitems=newslist.getElementsByTagName('li');
for(i=0;i<newsitems.length;i++)
{
h1=newsitems[i].getElementsByTagName('a');
DOMhelp.addEvent(hi,'click',news.peekaboo,false);

        }
},
peekaboo:function(e){
var newslist=document.getElementById('news');
var ps=newslist.getElementsByTagName('p');
         switch(ps){

case ps[1]:
         if(DOMhelp.cssjs('check',ps[1],news.hideClass))
{
DOMhelp.cssjs('remove',ps[1],news.hideClass);
}else{
DOMhelp.cssjs('add',ps[1],news.hideClass);
}
DOMhelp.cancelClick(e);
break;

case ps[2]:
         if(DOMhelp.cssjs('check',ps[2],news.hideClass))
{
DOMhelp.cssjs('remove',ps[2],news.hideClass);
}else{
DOMhelp.cssjs('add',ps[2],news.hideClass);
}
DOMhelp.cancelClick(e);
break;
}
}
}
DOMhelp.addEvent(window,'load',news.init,false);
/* CSS Document */
.hide{ position:absolute;
       top:0;
   left:-9999px;
   height:0;
   }
我的目的是想当我点击链接的时候这个链接下面的段落会打开，我写完隐藏每个段落后下面的不会写了，想用switch先试试，可是没成功，希望大虾能帮我解决下。
各种办法都可以希望是简便的！

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

peekaboo这个函数是我乱写的...没成功..希望有正确解答
哥们把你这个JS文件发上来
<script type="text/javascript" src="DOMhelp.js"></script>
// JavaScript Document
news={
    hideclass:'hide',
    init:function(){
        var i,h1;
        var newslist=document.getElementById('news');
        var ps=newslist.getElementsByTagName('p');
        for(i=0;i<ps.length;i++){
            DOMhelp.cssjs('add',ps[i],news.hideclass);}
        var newsitems=newslist.getElementsByTagName('li');
        for(i=0;i<newsitems.length;i++){
h1=newsitems[i].getElementsByTagName('a')[0];
            DOMhelp.addEvent(h1,'click',news.peekaboo,false);
}
    },
    peekaboo:function(e){
         var newslist=document.getElementById('news');
         var ps=newslist.getElementsByTagName('p');
for(var i = 0; i < ps.length; i++){
switch(ps[i]){

case ps[1]:

if(DOMhelp.cssjs('check',ps[1],'hide'))
{
DOMhelp.cssjs('remove',ps[1],'hide');
}else{
DOMhelp.cssjs('add',ps[1],'hide');
}
DOMhelp.cancelClick(e);
break;

case ps[2]:
if(DOMhelp.cssjs('check',ps[2],'hide'))
{
DOMhelp.cssjs('remove',ps[2],'hide');
}else{
DOMhelp.cssjs('add',ps[2],'hide');
}
DOMhelp.cancelClick(e);
break;
}
}
    }
}
DOMhelp.addEvent(window,'load',news.init,false);
/*
DOMhelp 1.0
written by Chris Heilmann
http://www.wait-till-i.com
To be featured in "Beginning JavaScript for Practical Web Development, Including  AJAX"
*/
DOMhelp={
debugWindowId:'DOMhelpdebug',
init:function(){
  if(!document.getElementById || !document.createTextNode){return;}
},
lastSibling:function(node){
  var tempObj=node.parentNode.lastChild;
  while(tempObj.nodeType!=1 && tempObj.previousSibling!=null){
   tempObj=tempObj.previousSibling;
  }
  return (tempObj.nodeType==1)?tempObj:false;
},
firstSibling:function(node){
  var tempObj=node.parentNode.firstChild;
  while(tempObj.nodeType!=1 && tempObj.nextSibling!=null){
   tempObj=tempObj.nextSibling;
  }
  return (tempObj.nodeType==1)?tempObj:false;
},
getText:function(node){
  if(!node.hasChildNodes()){return false;}
  var reg=/^\s+$/;
  var tempObj=node.firstChild;
  while(tempObj.nodeType!=3 && tempObj.nextSibling!=null || reg.test(tempObj.nodeValue)){
   tempObj=tempObj.nextSibling;
  }
  return tempObj.nodeType==3?tempObj.nodeValue:false;
},
setText:function(node,txt){
  if(!node.hasChildNodes()){return false;}
  var reg=/^\s+$/;
  var tempObj=node.firstChild;
  while(tempObj.nodeType!=3 && tempObj.nextSibling!=null || reg.test(tempObj.nodeValue)){
   tempObj=tempObj.nextSibling;
  }
  if(tempObj.nodeType==3){tempObj.nodeValue=txt}else{return false;}
},
createLink:function(to,txt){
  var tempObj=document.createElement('a');
  tempObj.appendChild(document.createTextNode(txt));
  tempObj.setAttribute('href',to);
  return tempObj;
},
createTextElm:function(elm,txt){
  var tempObj=document.createElement(elm);
  tempObj.appendChild(document.createTextNode(txt));
  return tempObj;
},
closestSibling:function(node,direction){
  var tempObj;
  if(direction==-1 && node.previousSibling!=null){
   tempObj=node.previousSibling;
   while(tempObj.nodeType!=1 && tempObj.previousSibling!=null){
     tempObj=tempObj.previousSibling;
   }
  }else if(direction==1 && node.nextSibling!=null){
   tempObj=node.nextSibling;
   while(tempObj.nodeType!=1 && tempObj.nextSibling!=null){
     tempObj=tempObj.nextSibling;
   }
  }
  return tempObj.nodeType==1?tempObj:false;
},
initDebug:function(){
  if(DOMhelp.debug){DOMhelp.stopDebug();}
  DOMhelp.debug=document.createElement('div');
  DOMhelp.debug.setAttribute('id',DOMhelp.debugWindowId);
  document.body.insertBefore(DOMhelp.debug,document.body.firstChild);
},
setDebug:function(bug){
  if(!DOMhelp.debug){DOMhelp.initDebug();}
  DOMhelp.debug.innerHTML+=bug+'\n';
},
stopDebug:function(){
  if(DOMhelp.debug){
   DOMhelp.debug.parentNode.removeChild(DOMhelp.debug);
   DOMhelp.debug=null;
  }
},
getKey:function(e){
  if(window.event){
       var key = window.event.keyCode;
     } else if(e){
       var key=e.keyCode;
     }
  return key;
},
/* helper methods */
getTarget:function(e){
  var target = window.event ? window.event.srcElement : e ? e.target : null;
  if (!target){return false;}
  while(target.nodeType!=1 && target.nodeName.toLowerCase()!='body'){
   target=target.parentNode;
  }
  return target;
},
stopBubble:function(e){
  if(window.event && window.event.cancelBubble){
   window.event.cancelBubble = true;
  }
  if (e && e.stopPropagation){
   e.stopPropagation();
  }
},
stopDefault:function(e){
  if(window.event && window.event.returnValue){
   window.event.returnValue = false;
  }
  if (e && e.preventDefault){
   e.preventDefault();
  }
},
cancelClick:function(e){
  if (window.event){
   window.event.cancelBubble = true;
   window.event.returnValue = false;
  }
  if (e && e.stopPropagation && e.preventDefault){
   e.stopPropagation();
   e.preventDefault();
  }
},
addEvent: function(elm, evType, fn, useCapture){
  if (elm.addEventListener){
   elm.addEventListener(evType, fn, useCapture);
   return true;
  } else if (elm.attachEvent) {
   var r = elm.attachEvent('on' + evType, fn);
   return r;
  } else {
   elm['on' + evType] = fn;
  }
},
cssjs:function(a,o,c1,c2){
  switch (a){
   case 'swap':
    o.className=!DOMhelp.cssjs('check',o,c1)?o.className.replace(c2,c1):o.className.replace(c1,c2);
   break;
   case 'add':
    if(!DOMhelp.cssjs('check',o,c1)){o.className+=o.className?' '+c1:c1;}
   break;
   case 'remove':
    var rep=o.className.match(' '+c1)?' '+c1:c1;
    o.className=o.className.replace(rep,'');
   break;
   case 'check':
    var found=false;
    var temparray=o.className.split(' ');
    for(var i=0;i<temparray.length;i++){
     if(temparray[i]==c1){found=true;}
    }
    return found;
   break;
  }
},
    safariClickFix:function(){
      return false;
    }
}
DOMhelp.addEvent(window, 'load', DOMhelp.init, false);
看了好像不对...我之前思路也不对...我那个也不对...
这个最新写的没对
peekaboo:function(e){
var section=DOMhelp.getTarget(e).parentNode;
if(DOMhelp.cssjs('check',section,news.hideclass)){
DOMhelp.cssjs('swap',section,news.hideclass,news.current);
}else{
DOMhelp.cssjs('swap',section,news.current,news.hideclass);
}
DOMhelp.cancelClick(e);
}
/* CSS Document */
.hide{
display:none;
   }
.current{
display:block;
}
楼主你的意思不就是页面刚加载完就隐藏P标签然后给A标签绑定点击事件~·然后点击A标签 P标签显示
楼主想要的是不是这种效果：
http://www.abaonet.com/demo/codeR/d2079/index.htm