Question

我有一个像这样的切换功能：

$('ul.internal-nav-list li ').on('click', function () {
        $(this).find('.internal-sub-list li ').toggle();

问题是，当您单击切换子菜单时，页面会跳转到顶部。所以我尝试使用

$('ul.internal-nav-list li ').on('click', function (e) {
        $(this).find('.internal-sub-list li ').toggle();
            e.preventDefault();

这解决了问题，然而子菜单的链接不起作用。有人知道解决方法吗？

更新

这是html

<ul class="internal-nav-list">
                        <li><a href="#">applications</a>
                            <ul class="internal-sub-list">
                                <li><a href="../sos.aspx">Structures</a></li>
                                <li><a href="../tanks.aspx">Containment Areas</a></li>
                                <li><a href="../pumps.aspx">Pumps</a></li>
                                <li><a href="../hex.aspx">Heat Exchangers</a></li>  
                            </ul> 
                        </li>

Answer 1

可能有更好的方法，但如果没有HTML，就很难帮助你。但是你可以检查以确保它不是被点击的锚点

if (!$(e.target).is(".internal-sub-list a")) {
    e.preventDefault();
}

Answer 2

在不需要是活动链接的锚链接上添加e.preventDefault（）（我相信你也有一个href =“＃”元素。）

作为全球修复，您可以拥有以下内容：

$('a[href="#"]').on('click', function(e) {
    e.preventDefault();
});

切换问题 - 单击时跳转到页面顶部

2 个答案: