JavaScript Reference
优质
小牛编辑
135浏览
2023-12-01
Foundation为Dropdown窗格提供了JavaScript组件，如下所示。
初始化 (Initializing)
您可以使用foundation.dropdown.js和foundation.core.js插件在JavaScript中初始化窗格。 foundation.core.js插件需要以下库 -
foundation.util.keyboard.js
foundation.util.box.js
Foundation.Dropdown
它指定下拉定义的实例，如下所述 -
var my_element = new Foundation.Dropdown(element);
下拉列表包括表格中列出的以下事件 -
| Sr.No. | 名称和描述 | 类型 |
|---|---|---|
| 1 | element 它在下拉列表中创建一个jQuery对象。 | jQuery |
| 2 | options 它会覆盖默认插件设置。 | Object |
插件选项 (Plugin Options)
您可以使用以下插件选项来自定义下拉列表实例。
| Sr.No. | 名称和描述 | 例 |
|---|---|---|
| 1 | hoverDelay 它指定在悬停事件上打开子菜单所用的时间。 | 250 |
| 2 | hover 它会在悬停事件中打开子菜单。 | false |
| 3 | hoverPane 将鼠标悬停在下拉窗格上时不会关闭下拉列表 | true |
| 4 | vOffset 当您打开下拉窗格和触发元素时，它会提供像素数。 | 1 |
| 5 | hOffset 当您打开下拉窗格和触发元素时，它会提供像素数。 | 1 |
| 6 | positionClass 它用于在应用类进行调整时调整位置。 | 'top' |
| 7 | trapFocus 如果使用键盘命令打开下拉列表，此插件会将焦点捕获到下拉窗格。 | false |
| 8 | autoFocus 它用于将焦点设置在窗格上的元素上。 | true |
事件 (Events)
下拉窗格提供表中列出的以下事件 -
| Sr.No. | 名称和描述 |
|---|---|
| 1 | closeme.zf.dropdown 它用于关闭其他打开的下拉菜单。 |
| 2 | show.zf.dropdown 它显示可见时的下拉窗格。 |
功能 (Functions)
“下拉”窗格提供以下列出的功能 -
.getPositionClass - 它指定下拉窗格的当前位置。
.open - 它显示下拉窗格并通过使用冒泡事件触发关闭其他下拉列表。
.close - 它关闭打开的下拉窗格。
.toggle - 它切换下拉窗格。
.destroy - 它会破坏下拉窗格。