Question

当我将$("header nav ul").toggleClass("open")放在点击功能之外时，它可以工作，但是当我把它放进去时它就没有了。为什么？??

警报方法正在运行，因此单击a标签可以正常工作。

    <header>
        <div class="wrapper">
            <h1 class="logo">Blesto</h1>
            <nav>
                <a href="" class="burger-nav"></a>
                <h2>Main Navigation</h2>
                <ul class="burger-nav-ul">
                    <li><a href="">Our Story</a></li>
                    <li><a href="">Menu</a></li>
                    <li><a href="">Reservations</a></li>
                    <li><a href="">News</a></li>
                    <li><a href="">Reviews</a></li>
                </ul>
            </nav>
        </div>
    </header>

$(document).ready(function(){
    $(".burger-nav").click(function(){
        alert("hi");
        $("header nav ul").toggleClass("open");
    });
});

Answer 1

您需要停止anchor元素的默认行为。

$(".burger-nav").click(function(event){
    event.preventDefault();
    alert("hi");
    $("header nav ul").toggleClass("open");
});

你对alert正在运行是正确的，但随后会运行默认行为，该行为将发送到href指向的任何位置。在这种情况下，同一页面。

.toggleClass在函数内部不起作用

1 个答案: