Question

我正在研究带有可扩展盒子的jquery图表。主要问题是当一个盒子打开而我打开另一个盒子时，第一个盒子没有关闭。如何制作第二个框打开和第一个框关闭时的脚本？

我尝试在其中一个答案中使用代码，但不知怎的，我不能让它工作。感谢

HTML：

<h2 class="trigger"><a href="#">click to see more</a></h2> 
<div class="toggle_container"> 
    <div class="block"> 
      <h3>one</h3>
        <p>Consequat te olim letalis premo ad hos olim odio olim indoles ut venio iusto. Euismod, sagaciter diam neque antehabeo blandit, jumentum transverbero luptatum. Lenis vel diam praemitto molior facilisi facilisi suscipere abico, ludus, at. Wisi suscipere nisl ad capto comis esse, autem genitus. Feugiat immitto ullamcorper hos luptatum gilvus eum. Delenit patria nunc os pneum acsi nulla magna singularis proprius autem exerci accumsan. </p> 

        <p>Praesent duis vel similis usitas camur, nostrud eros opes verto epulae feugiat ad. Suscipit modo magna letalis amet et tego accumsan facilisi, meus. Vindico luptatum blandit ulciscor mos caecus praesent sed meus velit si quis lobortis praemitto, uxor. </p> 
    </div> 
</div> 

</div>

jquery的：

$(".toggle_container").hide();

$("h2.trigger").click(function(){
    $(this).toggleClass("active").next().slideToggle("slow");
});

Answer 1

我想你刚才描述了手风琴控制：

http://jqueryui.com/demos/accordion/

Answer 2

只有.slideToggle开放的那些关闭才能打开新的，如下所示：

$('h2.trigger').click(function() {
    $('.toggle_container').not(':hidden').hide();
    $('h2.trigger').toggleClass('active');
    $(this).next().slideToggle('slow');
}

您可以通过将.hide()替换为其他内容来设置关闭已打开的动画。

或者，您可以使用其他人已经构建并调试的手风琴控件，如Steve Wellens建议的那样。

如何制作一个带有可展开框的jquery图表，一次只有一个展开的框？

2 个答案: