显示/隐藏wordpress子菜单

我有一些困难，交换我的Wordpress菜单的行为。我在寻找它时徘徊点击显示时，而不是：显示/隐藏wordpress子菜单

<nav> 
    <ul> 
     <li> 
      <?php wp_nav_menu(array('theme_location' => 'header-menu')); ?> 
     <li> 
      <br /> 
     <form method="get" id="search_form" action="<?php bloginfo('home'); ?>"> 
      <input type="text" class="text searchForm" name="s" value="Search" > 
     </form> 
    </ul> 
</nav> 

jQuery(document).ready(function ($) { 
    $(".sub-menu").hide(); 
    $(".current_page_item .sub-menu").show(); 
    $("li.menu-item").click(function() { // mouse CLICK instead of hover 
     $(".sub-menu").hide(); // First hide any open menu items 
     $(this).find(".sub-menu").show(); // display child 
    }); 
});

当我将其更改为拨动它会杀死在菜单中的其他环节。我不知道这里的问题是什么...

来源

2014-11-25 user3328557

你能提供jsfiddle或其他演示吗？ – 2014-11-25 15:04:04

这是非常棘手的，因为它是我创建的一个自定义Wordpress模板，所以当你将鼠标悬停在菜单头部以显示下面的子菜单项时，它会正常工作，但是如果将其切换到切换状态以完全切换但会杀死其他导航项。 – user3328557 2014-11-25 15:08:29

我不在代码中说任何错误。必须有一些与dom结构有关的东西。没有它，我不能说太多。 – 2014-11-25 15:21:22

你可以使用jQuery的点击功能，而不是悬停。您还必须通过禁用超链接的默认行为来确保<a>标记不起作用。

jQuery(document).ready(function ($) { 
    $(".sub-menu").hide(); 
    $(".current_page_item .sub-menu").show(); 
    $("li.menu-item").click(function() { // mouse CLICK instead of hover 
     // Only prevent the click on the topmost buttons 
     if ($('.sub-menu', this).length >=1) { 
      event.preventDefault(); 
     } 
     $(".sub-menu").hide(); // First hide any open menu items 
     $(this).find(".sub-menu").show(); // display child 
     event.stopPropagation(); 
    }); 
});

来源

2014-11-25 15:22:45

这样几乎是正确的，它现在显示并快速隐藏。这可能是什么原因？ – user3328557 2014-11-25 15:29:20

我希望菜单保持打开状态，除非您点击菜单中的另一个项目，然后关闭它。 – user3328557 2014-11-25 15:32:41

编辑我的答案，以反映您请求的行为。 – 2014-11-26 09:20:47

显示/隐藏wordpress子菜单

回答

相关问题