Question

由于某种原因，以下简单的脚本将无效 - 我希望子菜单在我点击“投资组合”链接时切换（子菜单正确隐藏）。

如果我更改触发器div以使其位于页面的其他位置，则可以正常工作。有人可以解释下面的问题是什么？你不被允许窝或什么？

JS：

<script>
jQuery(document).ready(function ($) {
  $('.sub-menu').hide();
  $('#menu-item-154 > a').click(function(){
    $('.sub-menu').toggle();
  });
});
</script>

页面HTML

<div class="menu-main-menu-container">
  <ul id="menu-main-menu" class="">
    <li id="menu-item-154" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-154">
      <a href="#">Portfolio</a>
      <ul class="sub-menu">
        <li id="menu-item-26" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-26"><a href="/?page_id=20">ITEM 1</a></li>
        <li id="menu-item-55" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-55"><a href="/?page_id=48">ITEM 2</a></li>
      </ul>
    <li id="menu-item-56" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-56"><a href="/?cat=1">NEWS &#038; BLOG</a></li>
  </ul>
</div>

Answer 1

您没有关闭投资组合后的li：

<li id="menu-item-154" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-154">
  <a href="#">Portfolio</a>
</li>

为什么不在a href上使用clickevent？

<a id="opensub1" href="#">Portfolio</a>

Answer 2

使用find()

  $('.sub-menu').hide();
  $('#menu-item-154').find('a').click(function(){
    $('.sub-menu').toggle();
  });

jQuery切换嵌套内部触发器无法正常工作

2 个答案: