jquery - 将类添加到 div 后运行单击事件 - JQuery

Question

我在处理打开/关闭导航时遇到了一个问题。我隐藏了按钮，单击该按钮后，它将首先添加新类；而不是删除原来的。然后，一旦单击“打开”，就会发生相反的情况。问题是当尝试在打开的部分运行单击事件时，没有任何反应？

示例:

 <div class="hideNshow">
   <span><a href="#" onclick="return false">Hide</a></span>
 </div><!-- .hideNshow -->

现在，一旦单击 .hideNshow，新类将是 .openNav - 问题是在就绪语句中使用单击事件来检查 是否有效。 openNav点击后不会运行。

我不确定这里出了什么问题:

如有想法和建议，我们将不胜感激。

大卫

编辑

这是 Jquery:

$(document).ready(function () {
    var active = 0;
    var lastheight, lastMargin, lastmargintop;

    $(".open").click(function() {
        alert("working");
            $("#mainHead").css('height', lastheight);   
            $(".openNav").html("Hide");
            $(".openNav").css('margin-top', lastMargin);    
            $(".about").css('margin-top',lastmargintop);
            $(".openNav").addClass("hideNshow");
            $(".hideNshow").removeClass("openNav");
    });
    $(".hideNshow").click(function() {
            lastheight = $("#mainHead").height();
            lastMargin = $(".hideNshow").css('margin-top'); 
            lastmargintop = $(".about").css('margin-top');  
            $("#mainHead").css('height', '35px');   
            $(".hideNshow").html("Open");
            $(".hideNshow").css('margin-top', '-30px'); 
            $(".about").css('margin-top','45px');
            $(".hideNshow").addClass("openNav");
            $(".openNav").removeClass("hideNshow");
    });
});

Answer 1

这是因为当您使用普通事件处理程序时，这些事件处理程序只会添加到执行注册代码时满足选择器的那些元素中 - 在您的情况下，当页面加载时，div 可能具有 hideShow 仅类，以便仅添加该处理程序。

如果您希望延迟评估选择器，请使用事件删除

您需要使用事件委托(delegate)

//use document or any other immediate parent of the div
$(document).on('click', '.hideNshow', function(){
    //handle hide
})
//use document or any other immediate parent of the div
$(document).on('click', '.openNav ', function(){
    //handle show
})