Создание выпадающего меню со ссылкой на целевую страницу

Question

Я хотел бы иметь ниже упомянутых страниц в раскрывающемся списке .. Помните, что все тексты ссылки и ссылки на страницы дифф ..

Пример: " Brazil Pull "- ссылка 1 (model) - link 2 (summary) - link 3 ... и т. Д. ...

Страница уже существует с этими текстами как ссылки .. Мне нужно создать выпадающее меню их ... Как?

Бразилия Прицепные (модель) (заказы) (резюме) (контакты)
Бразилия Вставные Дополнительный SKU Rev (модель) (заказы) (резюме) (контакты)
Бразилия Вставные Новые Поставляются изм продукта (модель) (заказы) (резюме) (контакты)

Бразилия переоценивается (модель) (заказы) (резюме) (контакты)
Китай Биология Фаза 1 (модель) (заказы) (резюме) (контакты)
Китай Химия испытаний (модель) (заказы) (краткая информация) (контакты)
Китай Vetec (модель) (приказы) (краткая запись) (контакты)
Япония Материал Наука Тест (модель) (заказы) (краткое содержание) (контактные данные)
Мексика Тест Vetec (модель) (заказы) (краткое содержание) (контактные данные)
Сингапурская химическая фаза 1 (модель) (заказы) (резюме) контакты)

Answer 1

Ниже приведен пример в jsFiddle. Использование bootstrap в качестве базы js.

<div class="dropdown"> 
    <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true"> 
    Dropdown 
    <span class="caret"></span> 
    </button> 
    <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1"> 
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Brazil Pull (model) (orders) (summary) (contacts)</a></li> 
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Brazil Push Additional SKU rev (model) (orders) (summary) (contacts) 3. 3. Brazil Push Newly Stocked Product rev (model) (orders) (summary) (contacts)</a></li> 
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Brazil Reprice (model) (orders) (summary) (contacts)</a></li> 
    </ul> 
</div>