0

我有人为我写了这个然后去了 MIA 并且无法弄清楚如何自己调整它。我对 jQuery 有点陌生。这是一个可扩展的侧边栏导航<ul>，目前整个东西在点击时是可扩展和可收缩的。

我试图让第一个标题 1<ul>永久“扩展”以显示链接 1 和链接 2，但保持 jQuery 在标题 2（以及 3、4、5 等）上工作。

我怎样才能永久保持第一个<ul>打开？非常感谢您的帮助！

<div class="sidebar">
<nav>
<span class="heading">Title 1</span>
<ul>
<li><a href="/firstlink">Link 1</a></li>
<li><a href="/firstlink">Link 2</a></li>
</ul>
</nav>

<nav>
<span class="heading">Title 2</span>
<ul>
<li><a href="/firstlink">Link 1</a></li>
<li><a href="/firstlink">Link 2</a></li>
</ul>
</nav>
</div>

这是使它扩展和收缩的 jQuery 位：

jQuery(window).load(function(){
jQuery('#body .sidebar nav').click(function(){
    var the_ul = jQuery('> ul', this);
    if(the_ul){
        if (the_ul.css('display') == 'none') {
            jQuery(the_ul).slideDown('500');
        } else {
            jQuery(the_ul).slideUp('500');
        }
    };
});  
});

这是CSS：

.sidebar nav ul {display:none;}
4

2 回答 2

1

我认为这就是你想要的：

$('.sidebar nav ul:eq(0)').show();

$('.sidebar nav').click(function(){
    var the_ul = $(this).find("ul");

    if(the_ul){
        if (the_ul.css('display') == 'none') {
            the_ul.slideDown('500');
        } else {
            the_ul.slideUp('500');
        }
    };
});

Working Demo

于 2013-04-07T12:55:04.970 回答
0

试试这个（http://jsfiddle.net/v7JhL/1/）并删除CSS：

jQuery('#body .sidebar nav:gt(0)').click(function(){
    var the_ul = jQuery('> ul', this);
    if(the_ul){
        if (the_ul.css('display') == 'none') {
            jQuery(the_ul).slideDown('500');
        } else {
            jQuery(the_ul).slideUp('500');
        }
    };
});
jQuery('.sidebar nav > ul:gt(0)').hide()
于 2013-04-07T12:51:17.250 回答