Foundation - Drilldown JavaScript 参考

Foundation 为向下钻取菜单提供了 JavaScript 组件,如下所示。

初始化

您可以使用 foundation.drilldown.jsfoundation.core.js 插件在 JavaScript 中初始化向下钻取菜单。该插件需要以下库 −

  • foundation.util.keyboard.js

  • foundation.util.motion.js

  • foundation.util.nest.js

Foundation.Drilldown

它指定了如下定义的向下钻取菜单的实例 −

var elem = new Foundation.Drilldown(element);
Sr.No. 名称 &描述 类型
1

element

它在下拉菜单中创建一个 jQuery 对象。

jQuery
2

options

默认插件设置是覆盖。

对象

插件选项

您可以使用以下插件自定义下拉菜单实例。您可以将插件选项设置为单独的数据属性。

Sr.No. 名称和说明 示例
1

backButton

js-drilldown-back 类是必需的。对于 JS 生成的后退按钮,使用标记。

<\li><\a>Back<\/a><\/li>
2

wrapper

is-drilldown 类是独立样式所必需的。

<\div class = "is-drilldown"><\/div>
3

closeOnClick

单击主体可帮助菜单返回根列表。

false

事件

附加到任何元素的下钻菜单插件都可以触发以下事件。

Sr.No. 名称和说明
1

closed.zf.drilldown 菜单

当菜单完全关闭时触发事件。

2

hide.zf.drilldown 菜单

当打开的子菜单关闭时触发事件。

函数

以下是下拉式菜单中使用的函数。

._hideAll

关闭所有打开的元素,并返回到根菜单。

._back

每个 back 按钮都包含事件监听器。

Sr.No. 姓名 &描述 类型
1

$elem

back 事件包含在当前子菜单中。

jQuery

._show

子菜单已打开。

Sr.No. 名称 &描述 类型
1

$elem

打开当前子菜单。

jQuery

._hide

子菜单已隐藏。

Sr.No. 名称 &描述 类型
1

$elem

隐藏当前子菜单

jQuery

.destroy

向下钻取菜单已销毁。

foundation_navigation.html