Bootstrap - Dropdown插件

Bootstrap Dropdown Plugin - 从概述，环境设置，基本结构，全局样式，网格系统，流体网格系统，布局，响应式设计，排版，表格，按钮，图像，图标，下拉列表，按钮，从简单而简单的步骤学习Bootstrap组，导航元素，导航栏，面包屑，分页，标签，徽章，版式，缩略图，警报，进度栏，媒体对象，Javascript插件像过渡，模态，下拉列表，Scrollspy，选项卡，工具提示，弹出，警报，按钮，折叠， Carousel，Typeahead，Affix，Glyphicons，Jumbotron，Demos。

使用Dropdown插件，您可以向任何组件添加下拉菜单，如导航栏，标签，药片和按钮.

如果您想单独包含此插件功能，那么您将需要 dropdown.js 的.另外，如 Bootstrap插件概述一章所述，您可以包含 bootstrap.js 或缩小 bootstrap.min.js .

用法

您可以切换下拉插件的隐藏内容 :

通过数据属性 : 将 data-toggle ="下拉列表"添加到链接或按钮以切换下拉列表，如下所示 :

   Dropdown trigger            ...

如果您需要保持链接不变(如果浏览器未启用，这将非常有用) JavaScript)，使用数据目标属性而不是 href ="＃" :

         Dropdown                      ...

通过JavaScript : 要通过JavaScript调用下拉切换，请使用以下方法 :

$('.dropdown-toggle').dropdown()

示例

在Navbar中

以下示例演示了导航栏中下拉菜单的使用情况 :

         TutorialsPoint                        iOS         SVN
                                             Java                                                                   jmeter
               EJB
               Jasper Report
                                             Separated link
                                             One more separated link

默认导航演示

在标签内

以下示例演示了标签内的下拉菜单的使用和减号;

Tabs With Dropdown Example

Home

SVN

iOS

VB.Net

Java

Swing

jMeter

EJB

Separated link

PHP

默认导航演示

选项

没有选项.

方法

下拉切换有一个显示或隐藏下拉列表的简单方法.

$().dropdown('toggle')

示例

以下示例演示了dropdown插件方法的用法.

         TutorialsPoint                     iOS         SVN
                     Java                                        jmeter
               EJB
               Jasper Report
                                             Separated link
                                             One more separated link

下拉插件方法演示