| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛
欢迎加入我们,一同切磋技术
用户名:   
 
密 码:  
共有 573 人关注过本帖
标题:js实现折叠与展开的一个问题!
只看楼主 加入收藏
gu_tong2008
Rank: 1
等 级:新手上路
帖 子:250
专家分:7
注 册:2009-9-18
结帖率:76.32%
收藏
已结贴  问题点数:6 回复次数:2 
js实现折叠与展开的一个问题!
有没有人能用javascript帮我解决这个问题,代码形如:
            <li><a onclick="jsfun()">展开/收缩</a>
                <ul>
                <li class="Child"><a a.html" target="right" >子列表1</a></li>
                <li class="Child"><a b.html" target="right" >子列表2</a></li>
                <li class="Child"><a c.html" target="right" >子列表3</a></li>
               </ul>
             </li>
当我点击一次"展开/收缩"的时候,它后面的无序列表展开,当我再点击"展开/收缩"的时候,它后面的无序列表收缩,.......如此循环,就是要实现"jsfun()"函数,能否举个例子实现,先谢过了。

[ 本帖最后由 gu_tong2008 于 2010-6-13 11:26 编辑 ]
搜索更多相关主题的帖子: 折叠 
2010-06-13 11:06
yms123
Rank: 16Rank: 16Rank: 16Rank: 16
等 级:版主
威 望:209
帖 子:12488
专家分:19042
注 册:2004-7-17
收藏
得分:3 
<script language="javascript">
function jsfun()
{
   if(document.getElementById("ChildUL").style.display=="")
      document.getElementById("ChildUL").style.display="none";
   else
      document.getElementById("ChildUL").style.display="";
}
</script>
<li><a onclick="jsfun()">展开/收缩</a>
   <ul id="ChildUL">
      <li class="Child"><a a.html" target="right" >子列表1</a></li>
      <li class="Child"><a b.html" target="right" >子列表2</a></li>
      <li class="Child"><a c.html" target="right" >子列表3</a></li>
   </ul>
 </li>
2010-06-13 14:28
gupiao175
Rank: 16Rank: 16Rank: 16Rank: 16
等 级:版主
威 望:40
帖 子:1787
专家分:7527
注 册:2007-6-27
收藏
得分:3 
<script language="javascript">
function jsfun()
{
   document.getElementById("ChildUL").style.display=(document.getElementById("ChildUL").style.display=='none')?'block':'none';
}
</script>
<li onclick="jsfun()" style="list-style:none;text-indent:5px;background:#f4f4f4;border-right:1px solid #000;border-bottom:1px solid #000;width:150px;height:30px;line-height:30px;"><a>展开/收缩</a></li>
<li id="ChildUL" style="list-style:none;display:none;">
   <ul style="list-style:none;">
      <li class="Child" style="padding:3px;"><a a.html" target="right" >子列表1</a></li>
      <li class="Child" style="padding:3px;"><a b.html" target="right" >子列表2</a></li>
      <li class="Child" style="padding:3px;"><a c.html" target="right" >子列表3</a></li>
   </ul>
</li>
改了一下,这样也可以,不管你的onclick代码放在哪都能实现类似效果,用任何标签,div,span等等都行,核心就是用JS去控制style对象的display属性,这种代码在树结构里用得比较多!

Q:1428196631,百度:开发地 即可找到我,有事请留言!
2010-06-13 15:49
快速回复:js实现折叠与展开的一个问题!
数据加载中...
 
   



关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.046960 second(s), 8 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved