Question

我不太了解Jquery而且我被卡住了，任何人都可以帮忙。

我点击时向下滑动的盒子，但是我想要它们，这样一次只能出现一个。当你打开一个，然后另一个他们都保持开放。有谁知道怎么做才能当一个人打开你点击第二个，第一个关闭而第二个打开??

感谢。

Answer 1

请不要提供外部链接，您应该在您的问题中发布代码。给jsfiddle.net再现你的问题会好得多。

来你的问题，

对这些点击事件中的两个元素执行slideToggle。

$('#dropdown').on('click',function(){
  $('.dropdownwrap').slideDown();
  $('.dropdownwrap2').slideUp();
});

$('#dropdown2').on('click',function(){
  $('.dropdownwrap').slideUp();
  $('.dropdownwrap2').slideDown();
});

Answer 2

您还可以使用jquery Accordion 。这是解决您问题的最佳解决方案，因为如果您的菜单数量增加，您编写slidetoggle的复杂性也会增加。所以让手风琴为你处理

Answer 3

如果你告诉我们你的代码，我可以给你一个更具体的答案，但你应该可以使用这样的东西：

$('.selector').click(function() {
    $(this).siblings().slideToggle();
});

这样，当您单击“selector”类中的任何元素时，它会关注您单击的$（this）元素，查找下拉列表的所有其他当前兄弟，并切换所有这些元素，包括您单击的元素。因此，它应该打开你点击的那个并关闭所有其他的。

Answer 4

为什么不使用JQuery UI Accordion。如果添加了新的部分，并且现在没有隐藏您的标题，您将更容易管理。

从他们的示例代码：

<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Accordion - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <script>
  $(function() {
    $( "#accordion" ).accordion();
  });
  </script>
</head>
<body>

<div id="accordion">
  <h3>Section 1</h3>
  <div>
    Section 1 Contents
  </div>
  <h3>Section 2</h3>
  <div>
    Section 2 Contents
  </div>
  <h3>Section 3</h3>
  <div>
    Section 3 Contents
  </div>
  <h3>Section 4</h3>
  <div>
    Section 4 Contents
  </div>
</div>


</body>
</html>

<强> [UPDATE] 在重播user2246968评论中：检查此fiddle这是代码结构的快速解决方法，但我仍然建议您花一些时间查看jQuery UI Accordion。

Slidedown Toggle Jquery

4 个答案: