上单击显示/隐藏子菜单( show/hide sub-menu on click)

我想列出我的网站（建于PHP和WordPress）在页脚的页面中，所有的顶级网页被垂直的，没有子弹上市这样的路程，有子页面的顶级页面列出。当顶部-level页面上点击。 当点击它再次的父页面的子页面隐藏。 我想这一切是在没有图形纯文本。

所以基本上它会是这样的：

家
关于莫泰V
满足业主| 客房| 设施| 画廊| 客户的反馈
城市和乡村>（如果单击该，它会显示“事情要做，看看|活动日历”）
预订
联系
博客

编辑

我看你是在暗示什么，但在WordPress产生通过添加“页面列表”页脚小工具区域列表，所以我不能添加一个唯一的ID ...

这是在当页面加载完成的来源。

<div class="widget widget_pages" id="pages-2">
<h4 class="widgettitle">Pages</h4>      
<ul>
  <li class="page_item page-item-14 current_page_ancestor current_page_parent"><a href="http://mywebsite.com.au/about-the-motel/">About the Motel</a>
    <ul class="children">
      <li class="page_item page-item-295"><a href="http://mywebsite.com.au/about-the-motel/meet-the-owners/">Meet The Owners</a></li>
      <li class="page_item page-item-17"><a href="http://mywebsite.com.au/about-the-motel/rooms/">Rooms</a></li>
      <li class="page_item page-item-19 current_page_item"><a href="http://mywebsite.com.au/about-the-motel/facilities/">Facilities</a></li>
      <li class="page_item page-item-21"><a href="http://mywebsite.com.au/about-the-motel/galleries/">Galleries</a></li>
      <li class="page_item page-item-2"><a href="http://mywebsite.com.au/about-the-motel/feedback/">Visitor Feedback</a></li>
    </ul>
  </li>
  <li class="page_item page-item-10"><a href="http://mywebsite.com.au/city-country/">City and Country</a>
    <ul class="children">
      <li class="page_item page-item-292"><a href="http://mywebsite.com.au/city-country/things-to-do-and-see/">Things To Do And See</a></li>
      <li class="page_item page-item-4"><a href="http://mywebsite.com.au/city-country/events-calendar/">Events Calendar</a></li>
      <li class="page_item page-item-53"><a href="http://mywebsite.com.au/city-country/local-links/">Local Links</a></li>
    </ul>
  </li>
  <li class="page_item page-item-5"><a href="http://mywebsite.com.au/bookings/">Bookings</a></li>
  <li class="page_item page-item-50"><a href="http://mywebsite.com.au/contact/">Contact</a></li>
  <li class="page_item page-item-47"><a href="http://mywebsite.com.au/blog/">Blog</a></li>
</ul>
</div>

Answer 1:

你可以用jQuery做到这一点。 而不是使用锚的“点击”属性的尝试把一个唯一的ID，并用它为您的jQuery的单击事件

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script> 
<script>
    $(function(){
        $(".page-item-10").click(function(){
          $(this+" ul").fadeToggle("slow");
        });

        $(".page-item-14").click(function(){
          $(this+" ul").fadeToggle("slow");
        });
    });
</script>

你不需要担心多个子菜单，因为主菜单具有独特的类属性

文章来源:

• show/hide sub-menu on click