Javascript 对jQuery Accordion稍加调整

我的演示中有一个基本的jQuery手风琴。我点击“关于我们”，它会在下面显示“团队”链接。耶

现在，有没有可能让这个手风琴工作，而不必有'项目'类中的超链接

所以它不是

，而是

？我问的原因是当前从WordPress生成的代码不包含“item”类，因此破坏了我的手风琴

这是我的演示：

还有我的JavaScript：

jQuery(function($) {

    $('#accordion a.item').click(function (e) {
    //remove all the "Over" class, so that the arrow reset to default
    $('#accordion a.item').not(this).each(function () {
    if ($(this).attr('rel')!='') {
    $(this).removeClass($(this).attr('rel') + 'Over');
    }
    $(this).siblings('ul').slideUp("slow");
    });

    //showhide the selected submenu
    $(this).siblings('ul').slideToggle("slow");

    //addremove Over class, so that the arrow pointing downup
    $(this).toggleClass($(this).attr('rel') + 'Over');
    e.preventDefault();
    });

});

---

非常感谢这里的提示：）

好吧，让我们分析一下

项在这个脚本中是如何使用的。就我所见，需要以某种方式区分第一级锚（手风琴窗格）和第二级锚（内容）。如果需要删除这个类，那么需要其他方法。例如，您可以依赖标记和标记层次结构。具体而言，不是按类选择选择器：

'#accordion a.item'

按层次使用选择器：

'#accordion > li > a'

以下是。
如果没有item类，它的工作原理如下：

    jQuery(function($) {

    $('#accordion > li > a').click(function (e) {
    //remove all the "Over" class, so that the arrow reset to default
        $('#accordion a').not(this).each(function () {
            if ($(this).attr('rel')!='') {
                $(this).removeClass($(this).attr('rel') + 'Over');
            }
        $(this).siblings('ul').slideUp("slow");
    });

    //showhide the selected submenu
    $(this).siblings('ul').slideToggle("slow");

    //addremove Over class, so that the arrow pointing downup
    $(this).toggleClass($(this).attr('rel') + 'Over');
        e.preventDefault();
    });

});

演示效果很好！！非常感谢。现在我将尝试并集成到我的解决方案中。再过2分钟：）效果很好-非常非常感谢您的详细回复和解决方案。祝你有美好的一天！！！嗨，安德烈。我现在注意到的唯一一个小问题是，当我点击“新闻”时，它不会在任何地方导航。有办法解决吗？@michaelmcgurk，当然有。注意这
e.preventDefault（）在单击处理程序的最后。它阻止元素的默认行为-对于锚定，它意味着打开新链接。因此，您可以根据子元素的存在选择性地执行此预防：如果有子元素，请防止默认行为并打开窗格，否则请不要阻止默认行为并导航到link.Aaah perfect。您是否可以更新小提琴，显示
e.preventDefault（）的位置应该去吗？我只是有点不确定该把它放在剧本的什么地方：）嗨，马蒂。太好了。安德烈在你之前一分钟左右贴出了类似的答案。非常感谢您为我整理了这个答案，它帮助我更了解它：）