jQuery: получить родительский идентификатор, родительский идентификатор?

80

<ul id ="myList">
<li><a href="www.example.com">link</a></li>
</ul>

Как я могу получить идентификатор ul (myList) с помощью jQuery? Мое событие j-script запускается при нажатии ссылки. Я пытался:

$(this).parent().attr('id');

Но он получает идентификатор li, мне нужно подняться на один выше, и я тоже не могу прикрепить щелчок к li.

jquery

— пантро
источник

166

$(this).parent().parent().attr('id');

Вот как вы могли бы получить идентификатор родителя.

РЕДАКТИРОВАТЬ:

$(this).closest('ul').attr('id');

Это более надежное решение для вашего случая.

— Кейси Фостер
источник

1

звонит родителю. дважды не является ни эффективным, ни будущим

— gotofritz

2

parent().parent()определенно быстрее, чем parents('ul')последний, поскольку последний будет искать до тега <html> в поисках тегов <ul> и возвращать их все. closest('ul')- хороший выбор, потому что он прекращает поиск после первого вхождения, но ближайший также включает элемент, для которого он вызывается. Возможно, $(this).parent().closest('ul')это лучший выбор, если только $(this)он никогда не станет <ul>.

— Кейси Фостер

Согласились, что «ближайший» - это идеальный подход. Сначала не понял, но любой селектор может работать вместо ul.

— HoldOffHunger 01

13

 $(this).closest('ul').attr('id');

— абхиджит
источник

0

Вот 3 примера:

$(document).on('click', 'ul li a', function (e) {
    e.preventDefault();

    var example1 = $(this).parents('ul:first').attr('id');
    $('#results').append('<p>Result from example 1: <strong>' + example1 + '</strong></p>');

    var example2 = $(this).parents('ul:eq(0)').attr('id');
    $('#results').append('<p>Result from example 2: <strong>' + example2 + '</strong></p>');
  
    var example3 = $(this).closest('ul').attr('id');
    $('#results').append('<p>Result from example 3: <strong>' + example3 + '</strong></p>');
  
  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul id ="myList">
  <li><a href="www.example.com">Click here</a></li>
</ul>

<div id="results">
  <h1>Results:</h1>
</div>

Развернуть фрагмент

Сообщите мне, было ли это полезно.

— Юрай Гуниш
источник