带有 + 和 - 的 jQuery 菜单用于打开和关闭子菜单答案

【问题标题】：jQuery menus with + and - for opening and closing submenus带有 + 和 - 的 jQuery 菜单用于打开和关闭子菜单
【发布时间】：2011-11-16 19:22:39
【问题描述】：

有谁知道任何有 + 和 - 用于打开和关闭子菜单的好的 jQuery 菜单。

我在谷歌上只找到了这个：
http://berndmatzner.de/jquery/hoveraccordion/

但这没有用于打开和关闭菜单的 + 和 - 并且只有 1 个子菜单。

例子

+ link
+ link 2
+ link 3

如果我点击链接2

+ link
- link 2
  + foo
  + foo2
+ link 3

【问题讨论】：

+ 和 - 是什么？图片？子菜单应该如何打开？点击？悬停？

标签： jquery

【解决方案1】：

如果您想要更有趣的自定义版本，请查看我为项目制作的原型..

http://jsfiddle.net/gaby/aJQNN/

更新

要绕过当前代码的点击，您需要在.click 处理程序的顶部添加一些代码。

所以改变

$('li').click(function() {

到

$('li').click(function(e) {
    if (e.target.nodeName === 'A' &&
            e.target.href &&
            e.target.getAttribute('href') !== '#'){
            return true;
        }

【讨论】：

@Gaby 完美解决方案。我也喜欢:)
但在演示中，我看到您的 ΤΟΠΟΙ 链接存在问题，该链接与ΤΟΥΡΚΙΑ 链接处于同一级别，但未显示在主页面上...当您单击 ΤΟΠΟΙ 链接时可见，该链接不是正确...
@senzacionale，它不在同一级别..只是源代码中的缩进错误..您可以在jsfiddle.net/gaby/aJQNN/8看到正确缩进的版本
是的，我明白了。感谢重播，感谢更新版本。单击+时是否可以不隐藏其他菜单？现在，当我点击第一个 + 然后在第二个中，三分之一消失。
是的，它是jsfiddle.net/gaby/aJQNN/9 最初的概念是试图让菜单看起来像面包屑......

【解决方案2】：

jQuery UI 有手风琴菜单：

http://jqueryui.com/demos/accordion/

您可以使用“图标”选项更改打开/关闭图像

例如：

var icons = {
    header: "ui-icon-circle-arrow-e",
    headerSelected: "ui-icon-circle-arrow-s"
};
$( "#accordion" ).accordion({
    icons: icons
});

【讨论】：

【解决方案3】：

您可以查看at 并在 css 中而不是箭头图像中提供您的 + 或 - 图像。

类似的东西here 再次更改悬停时的图像。

希望这会有所帮助。

【讨论】：

类似问题here