jquery - 下拉可见时将类添加到父 li a

Question

有一个愚蠢的问题，只是想在子菜单可见时向 li a 添加一个类。它是级联并将类添加到所有li a，甚至是子菜单中的一个。

<ul id="nav">
    <li><a href="#" target="_self">HOME</a></li>
    <li class="dropdown"><a href="#" target="_self">SYSTEM MANAGER<span aria-hidden="true" data-icon="&#xe000;"></span></a>
        <ul>
             <li><a href="#" target="_blank">Link 1</a></li>
        </ul>
    </li>
</ul>

JS

$('li.dropdown').on('mouseenter mouseleave', function(e){
        e.preventDefault();
        if (e.type === 'mouseenter')
            $(this).addClass('hilight');
        else
            $(this).removeClass('hilight');
    });

CSS

body header #headerContain nav#nav-wrap ul#nav li.dropdown.hilight a {
  color: #db4105;
}

如何让它仅适用于父 li.dropdown a 而不是级联到子 li a 的？

Answer 1

您应该使用child-selector，只需更改您的 css，

body header #headerContain nav#nav-wrap ul#nav li.dropdown.hilight > a {
  color: #db4105;
}