Question

我使用Underscores作为网站的基本主题，我真的深入研究它包含一个可行的移动导航元素作为主题的一部分。但这本质上是一个单页的网站，导航没有点击链接时切换...因为它没有离开页面。

所以我写了一个小脚本。

php-generated-HTML本质上就是这个（本文简化）：

<nav id="site-navigation" class="main-navigation toggled" role="navigation">
    <button class="menu-toggle" aria-controls="mobile-menu" aria-expanded="true"><i class="fa-bars fa"></i></button>
    <div class="menu-main-nav-container">
         <ul id="primary-menu" class="menu nav-menu" aria-expanded="true">
             <li class="menu-item"><a href="LINK">Link 1</a></li>
             <li class="menu-item"><a href="LINK#anchor-on-the-page">Link 2</a></li>
             <li class="menu-item"><a href="LINK#different-anchor-on-the-page">Link 3</a></li>
        </ul>
    </div>
</nav>

以下是我写的剧本：

<script type="text/javascript">
    $('.main-navigation.toggled li.menu-item a').mouseup(function(){
        $('.main-navigation.toggled').removeClass('toggled');
        $("button").attr("aria-expanded","false");
        $("#primary-menu").attr("aria-expanded","false");
    });
</script>

我确定有一些显而易见的东西我可以俯视，但我看不到它。

Answer 1

您的整个页面设置如何？如果这个javascript没有从页脚运行，你可能需要将你的javascript包装在document.ready中。它可能在元素尚未渲染时运行，并且可能无法附加mouseup事件。

试试这个：

alert('test');

这是一个小提琴。 http://jsfiddle.net/zsecLnd6/

如果这不起作用，请尝试

{{1}}

在mouseup和document ready函数中查看它是否正在运行。

Answer 2

行。这就是它的原因，我不知道为什么，但当我删除它'.main-navigation.toggled'时它起作用了。对我来说没有意义，因为那些课肯定在那里，但我也不在乎......因为它有效。：）

感谢您的帮助，伙计们！

Wordpress Underscores，用mouseup切换类似乎不起作用

2 个答案: