切换多个项目但希望一次只有一个可见？答案

【问题标题】：Toggle multiple items but wishing to only have one visible at a time?切换多个项目但希望一次只有一个可见？
【发布时间】：2013-01-08 21:39:12
【问题描述】：

Fiddle

这是我想做的：

每个红框 (<span class="more">) 显示/隐藏描述 (<div class="description">)
“关闭”链接也可以隐藏描述
如果已经打开了一个描述，当另一个打开时需要关闭它。因此，一次只能看到一个。

第 1 点和第 2 点，到目前为止一切顺利。但我被困在第 3 点上 - 我试图找到其他描述来隐藏它们，但是失败了！

$(".description").not(this).next(".description").removeClass("show")

有人可以帮忙吗？

【问题讨论】：

嗨，戈登！非常感谢您的快速回复！ :) 我在这里应用了你的建议：jsfiddle.net/dvusg/1 它修复了第 3 点，但不幸的是打破了第 1 点。 x x
如果你对他的回答发表评论，他会收到通知:)

标签： jquery jquery-selectors toggle css-selectors

【解决方案1】：

这应该解决它：http://jsfiddle.net/SMLwc/7/

$(document).ready(function () {

  $(".more").bind("click", function () {
    $(this).next(".description").toggleClass("show")
      .parent().siblings().find(".description").removeClass("show");
  });

  $(".close").bind("click", function () {
    $(this).parent(".description").toggleClass("show");
  });

});

【讨论】：

非常感谢！就这样搞定了！当您使用 .toggleClass 时，您是否必须将所有内容都放在一行中？我很想知道为什么我的建议和其他建议破坏了切换，但你的却没有。再次感谢 x x
不一定是这样，但只是链接而不是重新选择或将其存储在变量中是有意义的。

【解决方案2】：

将第 4 行更改为：

$(".description").removeClass("show"),

既然你是新的还没有显示，你把它们都关掉也没关系。

【讨论】：

谢谢马修！像这样？ jsfiddle.net/dvusg/1 和 Gorden 一样的问题，我认为它打破了第 1 点 - 因为切换不再起作用 x x

【解决方案3】：

$(".description").removeClass("show"),
$(this).next(".description").toggleClass("show");

Updated fiddle

【讨论】：

再次感谢，但点一个“每个红色框（）显示/隐藏描述（
）”现在不起作用.我错过了什么吗？ x x