Невозможно показать конкретный div по щелчку ниспадающей ссылки

У меня есть раскрывающееся меню, в котором я хочу показать другой div для каждой выбранной вами ссылки. Дивы успешно скрыты, но они не отображаются на клике... У кого-нибудь есть идея?

HTML

<select id="cd-dropdown" name="cd-dropdown">
<option value="-1" selected>The drop down menu</option>
<option value="1">Choice 1</option>
<option value="2">Choice 2</option>
<option value="3">Choice 3</option>
<option value="4">Choice 4</option>
</select>
<div id="1">Content 1</div>
<div id="2">Content 2</div>
<div id="3">Content 3</div>
<div id="4">Content 4</div>

JAVASCRIPT

$(function () { $('#cd-dropdown').dropdown({ gutter: 1, stack: false });
});
$(document).ready(function () { $('.box').hide(); $('#cd-dropdown').change(function () { $('.box').hide(); $('#' + $(this).val()).show("slow"); });
});
1 ответ

Working fiddleJQuery

$(function () { $('#cd-dropdown').dropdown({ gutter: 1, stack: false }); $('.box').hide(); $('.cd-dropdown ul li').click(function () { $('.box').hide(); $('#' + $(this).data("value")).show("slow"); });
});

Плагин, который вы используете, преобразует dropdown in div а затем выполняет необходимую анимацию... вы можете проверить его с помощью Firebug...

licensed under cc by-sa 3.0 with attribution.