Множество раскрывающихся меню на основе CSS и jQuery остаются открытыми после нажатия на другое

Question

Я настраиваю несколько раскрывающихся меню на основе jQuery на одной странице, основываясь на следующем руководстве: http://www.jankoatwarpspeed.com/post/2009/07/28/reinventing-drop-down-with-css-jquery.aspx.

Я изменил код в нескольких местах и ​​нашел следующее решение: http://jsfiddle.net/NcNHf/2/.

Работает довольно хорошо, но я ищу способ закрыть другие выпадающие меню , которые все еще открыты, когда я нажимаю на другое.

Так как же я могу убедиться, что на странице всегда можно активировать только одно раскрывающееся меню?

Заранее спасибо!

Answer 1

Вы можете выбрать все выпадающие списки и отфильтровать ток, а затем скрыть их все.

$(".dropdown > dt a").click(function (e) {
    var $ul = $(this).parent().next().find('> ul').toggle();
    $('.dropdown ul').not($ul).hide();
    e.preventDefault();
});

Рабочий пример