多个下拉窗口,打开另一个时会自动关闭

时间:2013-09-01 00:14:13

标签: javascript jquery html css

我有一个关于我在JSFiddle工作的例子,这样你就可以了解我正在做什么。我正试图找到一种方法,使打开另一个时打开的下拉菜单自动关闭。我找到的所有解决方案都要么保持打开或打开任何东西。同时关闭所有东西。请记住最后一页,他们将在这些下拉菜单中约有30个。

这是 jquery 代码。

    $(document).ready(function () {
        $(".answer").hide();

        $(".question").click(function () {
            $(this).next(".answer").slideToggle(500);
        });
    });

html 就像这样设置。

<p class="question">The question.</p>
<div class="answer">The answer.</div>
<p class="question">The question2.</p>
<div class="answer">The answer2.</div>
<p class="question">The question3.</p>
<div class="answer">The answer3.</div>
<p class="question">The question4.</p>
<div class="answer">The answer4.</div>

我对jquery&amp; amp;我在这里尽我所能。我一整天都在这里工作,只是来寻求帮助作为最后的手段。如果需要更多信息我会尽力提供。任何帮助是极大的赞赏!

1 个答案:

答案 0 :(得分:2)

仅当点击的答案不可见时才关闭所有打开的答案:http://jsfiddle.net/zFuUp/2/

$(document).ready(function() {
    $(".answer").hide();
    //toggle the componenet with class msg_body
    $(".question").click(function() {
        // Check if we are closing us
        if( ! $(this).next('.answer').is(':visible') )
            $('.answer').slideUp(500)

        // Open us
        $(this).next(".answer").slideToggle(500);
    });
});