Найти и отключить - PullRequest
       17

Найти и отключить

0 голосов
/ 29 ноября 2018

У меня странная структура, и я хочу отключить первый элемент внутри li.expanded, используя a[href="/abc"].У меня родитель и ребенок имеют одинаковые href и заголовок отличается.Как выбрать только родительский элемент?

Здесь код:

<ul class="n-right m-menu__link-list" id="main-right-menu">
    <li class="first leaf"><a href="/xyz" title="xyz-parent">xyz-parent</a></li>
    <li class="leaf"><a href="/pqr" title="pqr">pqr</a></li>
    <li class="last expanded"><a href="/abc" title="abc">abc</a>  //want to find this element and apply treatment

      <ul class="n-right m-menu__link-list" id="main-right-menu">
        <li class="first leaf"><a href="/abc" title="abc1">abc</a></li>  //not this one
        <li class="last leaf"><a href="/mno" title="mno">mno</a></li>
    </ul>
    </li>
</ul>

Что я пробовал, функция работает.он выбирает a[href="/abc"] родитель и потомок.Я хочу найти и выбрать только родительский.

openabcInNav: function() {
    var navEl = $('#main-menu, #main-right-menu li.expanded').find('a[href="/abc"]:nth-child(1)');
    navEl.addClass('doNotClose');
    navEl.on('click mouseover', function(event) {         
        event.preventDefault();
        $('nav.global-nav').find('li.expanded').toggleClass('show');
    });
},  

Ответы [ 2 ]

0 голосов
/ 29 ноября 2018

a[href="/abc"]:nth-child(1) смотрит на первый дочерний объект внутри a[href="/abc"]

Попробуйте использовать:

a[href="/abc"]:nth-of-type(1)

Это вернет первый, который соответствует a[href="/abc"]

0 голосов
/ 29 ноября 2018

Вы можете использовать селектор :first, который будет возвращать первое вхождение, как родительское:

$('ul>li.expanded>a[href="/abc"]:first')

$('ul>li.expanded>a[href="/abc"]:first').css('background-color', 'green');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="n-right m-menu__link-list" id="main-right-menu">
  <li class="first leaf"><a href="/xyz" title="xyz-parent">xyz-parent</a></li>
  <li class="leaf"><a href="/pqr" title="pqr">pqr</a></li>
  <li class="last expanded"><a href="/abc" title="abc">abc</a> //want to find this element and apply treatment

    <ul class="n-right m-menu__link-list" id="main-right-menu">
      <li class="first leaf"><a href="/abc" title="abc1">abc</a></li> //not this one
      <li class="last leaf"><a href="/mno" title="mno">mno</a></li>
    </ul>
  </li>
</ul>
...