个人网上下了一段Jquery树形菜单代码，默认打开页面是全部展开的，需要全部缩起来，只显示第一级，求解修改哪里？
<!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=utf-8" /><title></title><!--图标样式--><link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" /><!--主要样式--><link rel="stylesheet" type="text/css" href="css/style.css" /><script type="text/javascript" src="js/jquery-1.7.2.min.js"></script><script type="text/javascript">$(function(){ $('.tree li:has(ul)').addClass('parent_li').find(' > span').attr('title', 'Collapse this branch'); $('.tree li.parent_li > span').on('click', function (e) { var children = $(this).parent('li.parent_li').find(' > ul > li'); if (children.is(":visible")) { children.hide('fast'); $(this).attr('title', 'Expand this branch').find(' > i').addClass('icon-plus-sign').removeClass('icon-minus-sign'); } else { children.show('fast'); $(this).attr('title', 'Collapse this branch').find(' > i').addClass('icon-minus-sign').removeClass('icon-plus-sign'); } e.stopPropagation(); });});</script></head><body><div class="tree well"><ul> <li> <span><i class="icon-minus-sign"></i> Parent2</span> <a style="display:none" href="#">Test</a> <ul> <li> <span ><i class="icon-globe"></i> Child</span> <a style="display:none" href="#">Test</a> </li> <li> <span><i class="icon-globe"></i> Child</span> <a style="display:none" href="#">Test</a> </li> </ul> </li> <li> <span><i class="icon-minus-sign"></i> Parent2</span> <a style="display:none" href="#">Test</a> <ul> <li> <span><i class="icon-globe"></i> Child</span> <a style="display:none" href="#">Test</a> </li> </ul> </li> <li> <span><i class="icon-globe"></i> Parent2</span> </li></ul></div></body></html>
没有人帮我嘛。。
.addClass('icon-plus-sign').removeClass('icon-minus-sign');
这是 增加样式与去除样式。jq里用show()与hide()来显示与隐藏
<!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=utf-8" /><title></title> <!--图标样式--><link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" /> <!--主要样式--><link rel="stylesheet" type="text/css" href="css/style.css" /> <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script><script type="text/javascript">$(function(){ $('.tree li:has(ul)').addClass('parent_li').find(' > span').attr('title', 'Collapse this branch'); $('.tree li.parent_li > span').live('click', function (e) { var children = $(this).parent('li.parent_li').find(' > ul > li'); if (children.is(":visible")) { children.hide('fast'); $(this).attr('title', 'Expand this branch').find(' > i').addClass('icon-plus-sign').removeClass('icon-minus-sign'); } else { children.show('fast'); $(this).attr('title', 'Collapse this branch').find(' > i').addClass('icon-minus-sign').removeClass('icon-plus-sign'); } e.stopPropagation(); });}); </script> </head><body> <div class="tree well"><ul> <li> <span><i class="icon-minus-sign"></i> Parent2</span> <a style="display:none" href="#">Test</a> <ul> <li> <span ><i class="icon-globe"></i> Child</span> <a style="display:none" href="#">Test</a> </li> <li> <span><i class="icon-globe"></i> Child</span> <a style="display:none" href="#">Test</a> </li> </ul> </li> <li> <span><i class="icon-minus-sign"></i> Parent2</span> <a style="display:none" href="#">Test</a> <ul> <li> <span><i class="icon-globe"></i> Child</span> <a style="display:none" href="#">Test</a> </li> </ul> </li> <li> <span><i class="icon-globe"></i> Parent2</span> </li></ul></div> <script>$('ul li ul:not(:first) li').hide()</script></body></html>
.addClass('icon-plus-sign').removeClass('icon-minus-sign');
这是 增加样式与去除样式。jq里用show()与hide()来显示与隐藏
a:link { color: #000000; text-decoration: none;}a:visited { color: #000000; text-decoration: none;}a:hover { color:#999999; text-decoration: underline;}a:active { color: #000000; text-decoration: none;}.tree { min-height:20px; padding:19px; margin-bottom:20px; background-color:#fbfbfb; border:1px solid #999; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05); -moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05); box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05)}.tree li { list-style-type:none; margin:0; padding:10px 5px 0 5px; position:relative}.tree li::before, .tree li::after { content:''; left:-20px; position:absolute; right:auto}.tree li::before { border-left:1px solid #999; bottom:50px; height:100%; top:0; width:1px}.tree li::after { border-top:1px solid #999; height:20px; top:25px; width:25px}.tree li span { -moz-border-radius:5px; -webkit-border-radius:5px; border:1px solid #999999; border-radius:5px; display:inline-block; padding:3px 8px; text-decoration:none}.tree li.parent_li>span { cursor:pointer}.tree>ul>li::before, .tree>ul>li::after { border:0}.tree li:last-child::before { height:30px}.tree li.parent_li>span:hover, .tree li.parent_li>span:hover+ul li span { background:#eee; border:1px solid #94a0b4; color:#000}
$(function(){ $('.tree li:has(ul)').addClass('parent_li').find(' > span').attr('title', 'Collapse this branch'); $('.tree li.parent_li > span').live('click', function (e) { var children = $(this).parent('li.parent_li').find(' > ul > li'); if (children.is(":visible")) { children.hide('fast'); $(this).attr('title', 'Expand this branch').find(' > i').addClass('icon-plus-sign').removeClass('icon-minus-sign'); } else { children.show('fast'); $(this).attr('title', 'Collapse this branch').find(' > i').addClass('icon-minus-sign').removeClass('icon-plus-sign'); } e.stopPropagation(); });}); <script>$('ul li ul:not(:first) li').hide()</script>
Qu'est-ce que la monnaie numérique
Comment ouvrir les fichiers ESP
Comment désactiver la protection en temps réel dans le Centre de sécurité Windows
Quelles sont les nouvelles fonctionnalités de Hongmeng OS 3.0 ?
Comment débloquer un téléphone Oppo si j'ai oublié le mot de passe
Comment résoudre le problème que localhost ne peut pas être ouvert
MySQL crée une procédure stockée
Comment acheter et vendre du Bitcoin ? Tutoriel de trading Bitcoin
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
