javascript - 当事件类具有某些子页面时，如何向其添加事件类？

我正在Drupal 8网站上工作。在那我在分配活动类别到导航列表元素时遇到问题。
我使用以下代码设置了活动类，它适用于相同的URL。
 代码看起来像这样

 <nav id="getnav">
            <ul>
                <li>
                    <a class="" data-drupal-link-system-path="user" href="/drupal/todo">Todo</a>
                </li>
                <li>
                    <a class="" data-drupal-link-system-path="user" href="/drupal/files">Files</a>
                </li>
                <li>
                    <a class="" data-drupal-link-system-path="user" href="/drupal/photos">Photos</a>
                </li>
           </ul>
</nav>

我使用了jQuery函数来基于URL设置活动类。使用以下代码。

 function setActive() {
     var myurl =window.location.href.substr(window.location.href.lastIndexOf("/")+1);
       $("#getnav ul li a").each(function(){
        if($(this).attr("href") == '/drupal/'+myurl )
            $(this).addClass("active");
    });
}
     window.onload = setActive();

真正的问题是，只要访问子页面（如todo / page2），活动类就消失了。
     http://localhost/drupal/todo :::工作正常，但在访问子页面后

 http://loclahost/drupal/todo/add

全班没了

请给我关于这个问题的建议。

我也想将Active类设置为所有子页面。todo / *之后

最佳答案

您可以使用纯CSS做到这一点。您需要将class/id添加到body元素和nav li元素中，然后可以在要突出显示的css中定义它们的组合。例如，假设这是您的html：

< body id="todo_body">
 <nav id="getnav">
            <ul>
                <li class="todo_dropdown">
                    <a class="" data-drupal-link-system-path="user" href="/drupal/todo">Todo</a>
                </li>
                <li class="files_dropdown">
                    <a class="" data-drupal-link-system-path="user" href="/drupal/files">Files</a>
                </li>
                <li class="photos_dropdown">
</body>
                    <a class="" data-drupal-link-system-path="user" href="/drupal/photos">Photos</a>
                </li>
           </ul>
</nav>
</body>

现在，您可以使用如下所示的css将突出显示样式应用于“应该活跃”的li元素：

#todo_body .todo_dropdown,
#files_body .files_dropdown,
#photos_body .photos_dropdown
{
  background-color: red;
  color: white;
  /*Your css styles for active nav item will come here */
}

您还可以向should be active li元素中包含的任何元素添加任何样式。

关于javascript - 当事件类具有某些子页面时，如何向其添加事件类？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/38408329/