jQuery 隐藏仅适用于 Chrome Mac 和 IE，不适用于 Chrome PC 或 FF

Question

I have a small function that I wrote to hide a submenu on a wordpress site that uses FoundationPress as a template and unfortunately I've discovered that it doesn't work on Chrome PC or FF. I initially used toggle to hide it but switched to .hide() and then even setting it to .css("display","none") but the problem still persists on the PC side.

$(document).ready(function() {
    $('.top-bar-section li.active:not(.has-form) a:not(.button)').click(function() { 
        $("li.active ul.sub-menu.dropdown").hide();
    });
    $('.top-bar-section ul li').hover(function() {
        if($("li.active ul.sub-menu.dropdown").css("display", "none")){
           $("li.active ul.sub-menu.dropdown").css("display", "block");
        }
    });
})

What should happen is the user navigates to a section of the site and then uses the menu at the top to jump down to each section. So here: http://development.maclynutility.com/littlefriends/childrens-services/ if you use the menu to navigate anywhere within the current section (children's services) the menu stays active on a PC using Chrome or FF but hides on a Mac or IE. I need it to hide all the time and work like it does on IE or Mac Chrome. Thanks for any help.

Answer 1

It's not working because it is not able to find the

li.active ul.sub-menu.dropdown

Make sure what you are targetting.

Answer 2

if($("li.active ul.sub-menu.dropdown").css("display", "none")){
  $("li.active ul.sub-menu.dropdown").css("display", "block");
}

should be:

if($("li.active ul.sub-menu.dropdown").css("display") === "none"){
  $("li.active ul.sub-menu.dropdown").css("display", "block");
}

since $("li.active ul.sub-menu.dropdown").css("display", "none") will always hide and return the selected dom elements, which are "truthy", and therefore the if body will be executed, showing the dropdown.

However, since it will either display if it's hidden, or do nothing if it's displayed, that function will essentially do nothing differently than if you completely omitted the if statement. Did you intend for it to toggle? Or maybe to show while hovering but hide afterwards?