Question

我在javascript中用教程制作了这个列表手风琴菜单。

如你所见：每个主要的li类＆＃34; ToggleSubmenu＆＃34;变成了任何链接，但只是隐藏/显示其他子目录的类别。

我的问题是：如何获得相同的效果，但让ToggleSubmenu有链接并具有显示/隐藏功能？

如您所见，返回false会阻止该链接，但我无法将其删除。

编辑：理想情况下，如何添加名为＆＃34; .linked＆＃34;的类。说＆＃34;如果有这个类.linked，激活一个特定的链接。如果不这样做，它已经是＆＃34;

非常感谢你的帮助。

BENJ

$(document).ready( function () {
// all the sub menu are hidden
// except "open_at_load" one :
$(".navigation ul.subMenu:not('.open_at_load')").hide();
// we select all the list items with class "toggleSubMenu"

// we replace their span by a link :
$(".navigation li.toggleSubMenu span").each( function () {
    // we stock what is inside the span :
    var TexteSpan = $(this).text();
    $(this).replaceWith('<a href="" title="Afficher le sous-menu">' + TexteSpan + '<\/a>') ;
} ) ;

// we modify the "click" event on the linksin the list items
// wich have the class "toggleSubMenu" :
$(".navigation li.toggleSubMenu > a").click( function () {
    // Si le sub menu was already open, we hide it:
    if ($(this).next("ul.subMenu:visible").length != 0) {
        $(this).next("ul.subMenu").slideUp("normal", function () { $(this).parent().removeClass("open") } );
    }
    // if the sub menu is hidden, we close the other and we show it :
    else {
        $(".navigation ul.subMenu").slideUp("normal", function () { $(this).parent().removeClass("open") });
        $(this).next("ul.subMenu").slideDown("normal", function () { $(this).parent().addClass("open") } );
    }
    // we stop the link :
    return false;

});

Answer 1

我建议使用数据属性。为你想拥有链接的每个手风琴按钮添加一个数据属性（即称之为data-linkeaccordion）。

在具有此数据attr的每个元素上创建特定的单击句柄以打开一个新窗口，该url位于数据attr值中。

这不会搞乱现有的手风琴活动。

Answer 2

您可以在函数返回

中执行此操作

return $(this).hasClass("linked");

带有javascript链接问题的手风琴菜单

2 个答案: