2016-01-29 5 views
0

Выпадающее меню jQuery не появляется, когда я нажимаю на ссылку. Вот мой код.Выпадающий список jQuery не отображается при нажатии

<script src="Scripts/jquery-2.1.4.min.js"></script> 
<script src="Scripts/bootstrap.min.js"></script> 
<link href="Content/bootstrap.min.css" rel="stylesheet" /> 
<link href="Content/jquery.dropdown.css" rel="stylesheet" /> 
<script src="Content/bootstrap-filestyle.min.js"></script> 
<script src="Scripts/jquery.dropdown.js"></script> 

HTML:

<a href="#" data-dropdown="#ddlDept"><span class="fa fa-2x fa-gear"></span></a> 

        <div id="ddlDept" class="jq-dropdown jq-dropdown-tip"> 
         <ul class="jq-dropdown-menu"> 
          <li><a href="#1">Item 1</a></li> 
          <li><a href="#2">Item 2</a></li> 
          <li><a href="#3">Item 3</a></li> 
          <li class="jq-dropdown-divider"></li> 
          <li><a href="#4">Item 4</a></li> 
          <li><a href="#5">Item 5</a></li> 
          <li><a href="#5">Item 6</a></li> 
         </ul> 
        </div> 
+0

у вас есть список пунктов. где находится выпадающий список? – DinoMyte

+0

в том, что первая ul в теге ссылки .. у этого класса span есть значок, который работает как ссылка для выпадающего списка – Ash

ответ

1

Из документации JQuery Dropdowns, ваш контейнер DIV должен иметь уникальный идентификатор (чек) и класс JQ-выпадающий "непосредственно перед вашим закрытия тела тега". Для выпадающих меню div должен содержать раскрывающееся меню класса jq. Итак, похоже, что ваша единственная проблема - это префикс всех классов с помощью «jq-». Включает выпадающий список, раскрывающийся список, раскрывающийся список и выпадающее меню. http://labs.abeautifulsite.net/jquery-dropdown/

+0

Я не могу понять, в чем проблема. Мне это понравилось, но не показано: http://jsfiddle.net/ywWjE/19/ – Ash

+1

Да. единственной проблемой был префикс jq. Также мне нужно было добавить jq-префикс для переключения данных в тег ссылки. – Ash

2

Вам необходимо использовать атрибут data-toggle вместо data-dropdown. Также содержимое, которое нужно переключить, должно быть обернуто внутри элемента div.

<ul> 
<li> 
    <div class="dropdown"> 
<a href="#" id="ddlDept" data-toggle="dropdown"><span class="fa fa-2x fa-gear"> </span></a> 
    <ul class="dropdown-menu" aria-labelledby="ddlDept"> 
    <li><a href="#1">Item 1</a></li> 
    <li><a href="#3">Item 3</a></li> 
    <li class="dropdown-divider"></li> 
    <li><a href="#4">Item 4</a></li> 
</ul> 
</div> 
</li> 
</ul> 

Рабочий пример: http://jsfiddle.net/DinoMyte/5p341amh/263/

+0

Большое спасибо. Но я хочу использовать этот jquery-dropdown. – Ash

Смежные вопросы