Question

我解释问题的最简单方法是查看我的代码at jsfiddle

每个Div只有一个链接，一旦点击就将Div设置为活动+显示其中的隐藏Div。因此，当您再次单击该链接时，它会切换活动样式并隐藏隐藏的Div。这就是我想要它，但我也想要它，这样如果我点击另一个链接并且前一个Div仍然设置为激活它只会将Div（只是单击）设置为活动并切换前一个div。

如果您需要更多信息，我希望这是有道理的。

此外，如果您看到更好的编码这段代码的方法，我会喜欢建议。

感谢。

Answer 1

如果您的标记保证所有相关的div都是兄弟，那么这是有效的（并且不使用任何ID或属性）：

$('.href').click(function (ev){
    ev.preventDefault();

    // find enclosing div
    var p = $(this).closest('div');

    // make this one active, and make others inactive
    $(p).addClass('active')
        .siblings('.active').removeClass('active').find('.hidden').hide();

   // and change the hidden div
    $(p).find('.hidden').toggle();
})

http://jsfiddle.net/alnitak/y8kys/

中间线做了艰苦的工作 - 它确保外部div具有正确的类，没有兄弟姐妹这样做，并且每个兄弟中的隐藏元素也被隐藏。

我在http://jsfiddle.net/alnitak/ZfhbU/放了另一个版本，当封闭的div不是兄弟姐妹时，这个版本有效。

Answer 2

在显示隐藏的div之前，您可以检查所有其他隐藏的div元素，必要时隐藏它们，并在父div上切换样式：

$('.hidden').each(function() {
    if($(this).is(":visible")) {
       $(this).hide("slow");
       $(this).parent().toggleClass("active");
    }
});

有关示例，请参阅updated fiddle。

一次将一个元素设置为“活动”

2 个答案: