折叠jQuery菜单并添加样式
折叠jQuery菜单并添加样式
提问于 2013-08-04 16:46:28
我希望你们中的一个能帮我做些我正在创造的事情。我正在创建一个树式菜单，它将在我的计算机上打开文档。到目前为止，下面的代码是我所创建的。我的问题是，我希望它在打开时完全折叠，除非点击，否则不显示内容。我该怎么做呢？我也想要小加法箭头，当点击变成负号，而不是点，有什么想法吗？(我对这一切有点陌生)
谢谢
请注意，我的代码可以在这里看到http://cdpn.io/GtLky工作(但需要上面的修改)
或本节中的完整代码
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
</head>
<p><font size=4>This is a test</font></p> <body>
<ul>
<li><span class="Collapsable">Test 1</span><ul>
<li><span class="Collapsable">I like cats</span></li>
<li><span class="Collapsable">Cats rule</span></li>
</ul>
</li>
<li><span class="Collapsable">This is a test 2</span><ul>
<li><span class="Collapsable">Cat love</span></li>
<li><span class="Collapsable">testy cat</span></li>
</ul>
</li>
<li><span class="Collapsable">This is a test 3</span><ul>
<li><span class="Collapsable">Master Cat</span></li>
<li><span class="Collapsable"><a href = "http://www.nme.com">NME</span></li>
</ul>
</li>
</ul>
<script type="text/javascript">
$(".Collapsable").click(function () {
$(this).parent().children().toggle();
$(this).toggle();
});
</script>回答 1
Stack Overflow用户
回答已采纳
发布于 2013-08-04 17:09:40
我用.Collapsable元素清理了一些东西，并制作了一个JSFiddle来演示。
基本上，我们简化了HTML并增强了jQuery。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/18045199
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号