由于子菜单脚本，Mailto 或超链接在页脚菜单上不起作用答案

【问题标题】：Mailto or hyperlink doesn't work on footer menu due to submenu script由于子菜单脚本，Mailto 或超链接在页脚菜单上不起作用
【发布时间】：2014-12-15 07:54:59
【问题描述】：

对我的子菜单脚本执行我的 mailto 链接或任何超链接都不起作用，我不知道为什么以及在脚本中导致问题的位置。

$(function () {
$('footer > ul > li a').click(function(event) {
    event.preventDefault();
    event.stopPropagation();
    var $parentli = $(this).closest('li');
    $parentli.siblings('li').find('ul:visible').hide();
    $parentli.find('> ul').stop().toggle();
});
});

$(document).click(function() {
$("footer ul li ul").hide();
});

Fiddle: http://jsfiddle.net/foroloca/65t6gk5n/

【问题讨论】：

标签： javascript onclick footer submenu mailto

【解决方案1】：

你打电话给event.preventDefault();。这会阻止事件的默认功能，并最终阻止您的链接被触发。

如果您需要为页脚中的其他 a 元素设置此功能，我建议您专门为这些元素添加一个类名，并将您的事件处理程序修改为仅适用于这些元素：

<ul>
    <li>
        <a href="..." class="prevent-default">...</a>
    </li>
    <li>
        <a href="mailto:...">...</a>
    </li>
    ...
</ul>

$('footer > ul > li a.prevent-default').click(function(event) {
    event.preventDefault();
    ...
});

JSFiddle demo.

【讨论】：

感谢您的帮助，但子菜单现在不起作用，单击滚动条时再次跳到顶部。
@foroloca 您确定将类名添加到正确的元素并修改了您的 JavaScript，就像我在答案中指定的那样吗？
是的，但也是子菜单未打开的小提琴示例。顶部和信息菜单按钮与开始脚本一起工作正常，唯一的问题是当我在 MAIL 按钮上使用 mailto/hyperlink 时。我明白那是因为 event.preventDefault();但我需要它来防止跳到顶部。 TOP 按钮的脚本不同，但同样可以正常工作。再次感谢您
@foroloca 那是因为我忘记添加 prevent-default 类。请查看更新后的 JSFiddle：jsfiddle.net/65t6gk5n/4，我现在已将其编辑到我的答案中。

【解决方案2】：

您可以通过 href 使用选择器。

$('footer > ul > li a[href="#"]')

所有在 href (href="#") 中带有散列的超链接都将在您的 onclick 处理程序中触发

http://jsfiddle.net/65t6gk5n/3/

【讨论】：

感谢您的帮助，但有没有办法让您不需要额外的课程，它也可以用于超链接？
您可以通过 href 使用选择器。 $('footer > ul > li a[href="#"]') 并且所有在 href (href="#") 中带有哈希的超链接都将使用您的 onclick 处理程序jsfiddle.net/65t6gk5n/3 触发
是的，这就是我需要的！哎呀，这很简单 ;-) 谢谢！