jQuery UI 菜单 collapse() 方法介绍

概述

jQuery UI 菜单 collapse() 方法是一种用于折叠菜单的方法。它可以将菜单项隐藏起来，以节省空间，并提高用户体验。

用法

语法

$(selector).menu("collapse", event, item);

参数

• selector：必须，要添加折叠效果的菜单元素的选择器。
• event：可选，触发折叠效果的事件。
• item：可选，指定要折叠的项目，可以是一个jQuery对象或选择器字符串。

示例

$(function(){
  $("#menu").menu();

  $("#collapseBtn").on("click", function(){
    $("#menu").menu("collapse", null, $("#menu").find(".ui-menu-item:eq(1)"));
  });
});

在上面的示例中，我们先初始化了一个菜单，然后我们给一个按钮绑定了一个事件，当点击该按钮时，调用菜单的collapse()方法折叠了第二个菜单项。

说明

• 如果不指定item参数，则会折叠所有菜单项；
• 如果不指定event参数，则默认折叠所有菜单项时不触发事件，只有在指定了item参数时才会触发事件。

结语

jQuery UI 菜单 collapse() 方法是一个很常用的方法，可以让我们更好的定制菜单的折叠效果，以更好地适应不同的需求。