JavaScript 下拉列表不会在点击时关闭，混淆？

Question

感谢您查看我的帖子 - 我正在尝试弄清楚如何在单击链接时关闭此下拉菜单，但我的 JavaScript 技能非常缺乏，而且代码似乎很困惑。这是 HTML:

<nav class="site-nav" role="navigation">
  <ul class="pos-ul">                
    <li><a href="#menus" data-target="menus">Menu</a></li>
     <li><a href="#bar" data-target="bar">Wine + Cocktails</a></li>
  </ul>
  <a href="" class="mobile-trigger no-scroll">Menu</a>
</nav>

我认为控制它的缩小版 JavaScript 位于 http://sabiopleasanton.com/js/core.min.js

相关网站是http://sabiopleasanton.com当屏幕宽度低于 768px 时，会出现下拉菜单。感谢您的任何考虑，对于发布协议(protocol)中的任何不明确或缺陷，我深表歉意。

Answer 1

我记得前几天帮助您完成此页面上的 slider 转换。无论如何，这就是您所需要的:

$(document).ready(function() {
    if ($(window).width() <= 768) {

        $('ul.pos-ul > li > a').click(function() {
            $('.pos-ul').hide()
        });
    }

});

它将在移动导航中选择一个 anchor 标记，单击后它将隐藏下拉无序列表。只需编辑它以将其包装在文档就绪函数中，缩短选择器并确保它仅在视口(viewport)为 768px 或更小时时触发。