我希望点击时可以看到子菜单。我正在使用默认的WP导航。
为了检查我需要哪些元素,我检查了源代码,然后在我的代码中使用了相应的类。首先,当你悬停然后它们上升时会显示下拉菜单。这可能意味着脚本的第二部分有效。我究竟做错了什么?
$(document).ready(function(){
// Show hide popover
$(".menu-item menu-item-type-custom menu-item-object-custom current-menu-ancestor current-menu-parent menu-item-has-children menu-item-623 first-child a").click(function(){
$(this).find(".sub-menu ").slideToggle("fast");
});
});
$(document).on("click", function(event){
var $trigger = $(".menu-item menu-item-type-custom menu-item-object-custom current-menu-ancestor current-menu-parent menu-item-has-children menu-item-623 first-child");
if($trigger !== event.target && !$trigger.has(event.target).length){
$(".sub-menu").slideUp("fast");
}
});
<ul id="primary-menu" class="menu">
<li class="menu-item menu-item-type-custom menu-item-object-custom
current-menu-ancestor current-menu-parent menu-item-has-children menu-
item-623 first-child">
<a href="#">Explore</a>
<ul class="sub-menu">
<li id="menu-item-563" class="menu-item menu-item-type-post_type menu-
item-object-page current-menu-item page_item page-item-14
current_page_item menu-item-563 first-child"><a href="http://localhost:81/DEMO/why-develop-for-hue/">Why </a></li>
<li id="menu-item-562" class="menu-item menu-item-type-post_type menu-
item-object-page menu-item-562 last-child"><a href="http://localhost:81/DEMO/who-already-joined/">Who </a>
</li>
</ul>
</ul>
答案 0 :(得分:0)
可以使用navwalker解决此问题。 随意结帐: https://github.com/wp-bootstrap/wp-bootstrap-navwalker 你可以自己进一步探索 祝你好运!!!