Как получить родительское значение div a value - PullRequest
Новая
       9

Как получить родительское значение div a value

0 голосов
/ 20 января 2019

У меня html-код: 

<div class="top-menu">
  <div class="dropdown dropdown-inline">
    <a class="btn btn-primary dropdown-toggle" id="info" data-hover="dropdown" data-animations="zoomIn zoomIn zoomIn zoomIn" aria-expanded="false" >INFO</a>
  </div>
  <div class="dropdown dropdown-inline">
    <a class="btn btn-primary dropdown-toggle" data-hover="dropdown" data-animations="zoomIn zoomIn zoomIn zoomIn" aria-expanded="false">MAINITEM <span class="carot"></span></a>
    <ul class="dropdown-menu dropdownhover-bottom" role="menu">
      <li><a>A</a></li>
      <li><a>B</a></li>
      <li><a>C</a></li>
    </ul>
  </div>

Мне нужно, когда я нажимаю на элемент li (A, B или C), чтобы получить значение MAINITEM.У меня есть около 10 основных элементов на странице, и мне нужно получить значение MAINITEM.

Я пытаюсь использовать: 

$("a.btn.btn-primary.dropdown-toggle, ul.dropdown-menu.dropdownhover-bottom li a").on('click', function () {
  alert($(this).closest('.dropdown-toggle').find('a').text());
})

Но я получаю пустой результат.

Ответы [ 2 ]

0 голосов
/ 20 января 2019

Функция jQuery.closest() фильтрует только родительские элементы. Поскольку вы комбинируете два разных селектора, вы должны использовать общий родительский элемент для обоих целевых элементов. В вашем случае общий родитель - .dropdown.

Кроме того, вам необходимо убедиться, что вы фильтруете правильный элемент a, поскольку .dropdown может иметь много тегов привязки. В вашем случае вы можете использовать a.btn.

Ниже приведен рабочий пример с изменениями, предложенными выше. 

$("a.btn.btn-primary.dropdown-toggle, ul.dropdown-menu.dropdownhover-bottom li a").on('click', function(e) {
  alert($(this).closest('.dropdown').find('a.btn').text());
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="top-menu">
  <div class="dropdown dropdown-inline">
    <a class="btn btn-primary dropdown-toggle" id="info" data-hover="dropdown" data-animations="zoomIn zoomIn zoomIn zoomIn" aria-expanded="false">INFO</a>
  </div>
  <div class="dropdown dropdown-inline">
    <a class="btn btn-primary dropdown-toggle" data-hover="dropdown" data-animations="zoomIn zoomIn zoomIn zoomIn" aria-expanded="false">MAINITEM <span class="carot"></span></a>
    <ul class="dropdown-menu dropdownhover-bottom" role="menu">
      <li><a>A</a></li>
      <li><a>B</a></li>
      <li><a>C</a></li>
    </ul>
  </div>
0 голосов
/ 20 января 2019

Используйте это

http://jsfiddle.net/o90wnmuL/

 jQuery(".dropdown li a").click(function(){
   text =  jQuery(this).closest(".dropdown").find(".dropdown-toggle").text();
   console.log(text)
});
...