Question

我遇到了一个非常棘手的问题，我在通过点击事件添加display：none后无法触发下拉菜单。我之前尝试用悬停事件添加它，但这似乎在某些浏览器中一直触发，所以我放弃了它并完全卡住了。使用以下代码，如何在切换显示属性后再次正确显示下拉列表。

$(document).ready(function() {
    $('li.active ul.sub-menu.dropdown a').click(function() { 
        if($("li.active ul.sub-menu.dropdown").css("display", "block")){
           $("li.active ul.sub-menu.dropdown").hide();
        }
    });
})

早些时候提出类似问题的道歉，但我之前并没有真正理解这个问题。如果我不在线，我道歉但我真的卡住了。非常感谢任何帮助。

Answer 1

您是否尝试过使用behind？

identical

它会自动检查元素是否可见，然后切换显示属性。

Answer 2

尝试使用show（）函数：

$(document).ready(function() {
    $('li.active ul.sub-menu.dropdown a').click(function() { 
        if($("li.active ul.sub-menu.dropdown").css("display", "block")){
           $("li.active ul.sub-menu.dropdown").hide();
        }
       else if($("li.active ul.sub-menu.dropdown").css("display", "none")){
           $("li.active ul.sub-menu.dropdown").show();
    });
});

Answer 3

我认为，一般来说，通过在css中添加类来做这些事情会更好。你可以这样做：

$(document).ready(function() {
$('li.active ul.sub-menu.dropdown a').click(function() { 
    $("li.active ul.sub-menu.dropdown").toggleClass("show");
});
});

和css：

.show {
  display:block;
}

当然，使用.show（）和.hide（）也是可行的。它只会减少你的控制。

如何在应用display：none with jQuery

3 个答案: