只有当父级具有相同类时才使用样式菜单项类

Question

我在我的网站上有一个边栏导航菜单，我用一个名为腱部的插件创建了它，假设我的菜单有以下结构

-Menu Main 1
--Main-1 Sub-1
-Menu Main 2
-- Main-2 Sub-1
---Main-2 Sub-1 Sub-1
---Main-2 Sub-1 Sub-2

当我选择任何子菜单时，插件会用css类标记它的所有父母。因此，我不能只对所选项目进行样式设置，即假设我是单击的 Main-2 Sub-2链接，然后插件将为其父项Main-2 Sub-1和菜单Main 2添加类。我如何才能申请所选的菜单，是否存在不使用任何脚本的样式。请帮帮我。

编辑

HTML代码

 <li class="desig-menu">
          <asp:HyperLink ID="HyperLink16" runat="server" NavigateUrl="#"  CssClass="desig-nav">Master<span class="caret left-sm-caret"></span></asp:HyperLink>
          <ul  class="dropdown-level-1">
            <li><asp:HyperLink ID="HyperLink17" runat="server" NavigateUrl="#">Accounts<span class="caret left-sm-caret"></span>    </asp:HyperLink>
                <ul  class="dropdown-level-2">
                    <li>
                      <asp:HyperLink ID="HyperLink18" CssClass="account-grp-page-link"  runat="server" NavigateUrl="~/master/accounts/account_group.aspx">Account Group</asp:HyperLink>
                    </li>
                    <li>
                      <asp:HyperLink ID="HyperLink37" CssClass="account-ledger-page-link"  runat="server" NavigateUrl="~/master/accounts/account_ledger.aspx">Account Ledger</asp:HyperLink>
                    </li>
                    <li>
                      <asp:HyperLink ID="HyperLink38" CssClass="fin-year-page-link"  runat="server" NavigateUrl="~/master/accounts/financial_year.aspx">financial Year </asp:HyperLink>
                    </li>
                 </ul>
                  <li><asp:HyperLink ID="HyperLink39" runat="server" NavigateUrl="#">Services<span class="caret left-sm-caret"></span>    </asp:HyperLink>
                <ul  class="dropdown-level-2">
                    <li>
                      <asp:HyperLink ID="HyperLink40" CssClass="category-page-link"  runat="server" NavigateUrl="~/master/service/service_category.aspx">Service Category</asp:HyperLink>
                    </li>
                    <li>
                      <asp:HyperLink ID="HyperLink41" CssClass="service-page-link"  runat="server" NavigateUrl="~/master/service/service.aspx">Service</asp:HyperLink>
                    </li>
                 </ul>
            </li>
              <li><asp:HyperLink ID="HyperLink47" runat="server" CssClass="supplier-page-link" NavigateUrl="~/master/supplier_form.aspx">Supplier</asp:HyperLink>
            </li>
          </ul>

        </li>

Answer 1

尝试一下我的建议，单击li标记中的锚标记时执行以下命令：

var root=false;
var curr = this;
while(root==false) {
  if($(curr).parent().parent().parent().hasClass("desig-menu")==false) {
    $(curr).parent().parent().parent().addClass("classtoadd");
    curr=$(curr).parent().parent();
  }
  else {
    root=true;
  }
}