不要自动浏览新导航页面

Question

如果每个菜单项悬停，下面的菜单将更改为红色。

这个菜单显示在我网站的每一页上。

我有以下问题：

如果用户要单击菜单项(例如菜单2)，页面将导航到标签中的页面集(即page2.html)。

如果用户将鼠标留在那里，与单击菜单项之前的位置相同(即在选定的菜单项上)，则菜单将在新页上自动更改为红色，因为下面的jQuery悬停代码将被激活。

有什么办法阻止这种行为吗？理想情况下，我希望用户必须鼠标离开菜单项，然后在菜单项更改为红色之前再次单击菜单项，如果用户单击其中一个菜单链接后仍在选定菜单项上方。

<script type="text/javascript">

$(document).ready(function() {

    $('li').hover(function() {
        $(this).css('background', 'red');
    }, function() {
        $(this).css('background', 'none');
    })
})

</script>


<ul>
    <li><a href="page1.html">Menu 1</a></li>
    <li><a href="page2.html">Menu 2</a></li>
    <li><a href="page3.html">Menu 3</a></li>
</ul>

Answer 1

这是服务器端的任务。您必须将类附加到<li>，然后，在页面加载时，<li>上会出现类，这会给您带来您想要的效果。这样，最好使用addClass()和removeClass()而不是css()。例如，让它是类.active_link，放入您的CSS，然后根据需要控制它。