Question

在我的页面的移动视图中，当选择菜单选项时，它会下降并添加扩展的类值。单击菜单元素后，该值永远不会被删除。我需要在单击菜单中的任何项目时删除展开的类值，并删除展开的菜单，因为它覆盖了我的单页网站的整个页面。

    <p:column headerText="Color" sortBy="#{car.color}">
        <p:inputText value="#{car.color}" />
    </p:column>

Answer 1

单击菜单按钮时使用$('#menuContent').removeClass('expanded')，单击菜单项时使用$(document).ready(function() { $('#menuButton').click(function(event) { $('#menuContent').toggleClass('expanded'); }); $('.menuItem').click(function(event) { $('#menuContent').removeClass('expanded'); }); });，如下所示：

{{1}}

Here is a fully functional JSFiddle to demonstrate.

Answer 2

你可以这样做。

您可以通过检查该类是否存在来从每个菜单项单击的“顶栏”中删除该“扩展”类。

$(".top-bar-section ul li > a").click(function() {
    if($('.top-bar').hasClass('expanded')){
        $('.top-bar').removeClass('expanded')
    }
});

jquery帮助 - 在我的单页网站菜单选择中，扩展菜单移动不关闭

2 个答案: