jQuery : 부모, 부모 ID를 얻습니까?


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

jQuery를 사용하여 ul (myList)의 ID를 어떻게 얻을 수 있습니까? 링크를 클릭하면 내 j-script 이벤트가 트리거됩니다. 나는 시도했다 :

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

그러나 그것은 li의 id를 얻습니다. 나는 더 높은 곳으로 가야하고 li에도 클릭을 붙일 수 없습니다.

답변:


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

부모의 부모 ID를 얻는 방법입니다.

편집하다:

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

귀하의 케이스에 대한보다 완벽한 솔루션입니다.


1
전화 부모. 회도 효율적이지 미래의 증거입니다
gotofritz

2
parent().parent()parents('ul')후자가 <ul> 태그를 찾고 모든 태그를 반환하는 <html> 태그까지 검색하기 때문에 확실히 빠릅니다 . closest('ul')첫 번째 발생 후 검색을 중지하지만 가장 가까운 요소에는 호출되는 요소도 포함되므로 좋은 선택입니다. 는 결코 <ul>이되지 $(this).parent().closest('ul')않는 한 아마도 최선의 선택 일 $(this)것입니다.
Casey Foster

'가장 가까운'것이 이상적인 접근 방식이라는 데 동의했습니다. 처음에는 인식하지 못했지만 'ul'대신 모든 선택기가 작동 할 수 있습니다.
HoldOffHunger


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>

도움이되었는지 알려주세요.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.