SlideToggle导航内容？

Question

我想通过在我的导航中通过名称定位内容来在其中滑动具有不同内容的div。

我有这个已经：

$(".div1, .div2, .div3").hide(); 

$(document).ready(function(){ 

    $("nav a").click(function() { 
    var divname= this.name; 
    $("."+divname).siblings().slideUp(500, function() { 
    $("."+divname).slideToggle(); 
}); 
}); 
}); 

<nav> 
<a name="div1">SlideToggle Div 1</a> 
<a name="div2">SlideToggle Div 2</a> 
<a name="div3">SlideToggle Div 2</a> 
</nav> 

<div id="container"> 
<div class="div1">Content Div 1</div> 
<div class="div2">Content Div 2</div> 
<div class="div3">Content Div 3</div> 
</div> 

我想，每一个格向上滑动，再与新的div的内容slidesdown，即定位在menue等等。

问题与脚本：

有了两个div它的工作。添加第三个确实会使它向下滑动并向上滑动。添加第四个确实会使其滑落，向上滑动并向下滑动等等。兄弟姐妹的想法一定是错的吗？

谢谢。

Answer 1

有一个工作jsfiddle页面，所以看看this。我在你的代码上做了一些工作，看看这是你想要的。 更新了代码立即重试链接。

$(".div1, .div2, .div3").hide(); 
$(document).ready(function() { 
    var firstTime = true; 
    $("nav a").click(function() { 
    var divname = this.name; 
    if (!firstTime) { 
     if ($(".slid").hasClass(divname)) { 
      firstTime = true; 
      $(".slid").removeClass("slid").slideUp(); 
     } else { 

      $(".slid").removeClass('slid').slideUp(500, function() { 
       $("." + divname).slideToggle().addClass("slid"); 

      }); 
     } 
    } else { 
     $("." + divname).slideDown().addClass("slid"); 
     firstTime = false; 
    } 

    }); 
});