jQuery: माता-पिता, मूल आईडी प्राप्त करें?

80

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

मैं jQuery का उपयोग करके उल (myList) की आईडी कैसे प्राप्त कर सकता हूं? लिंक पर क्लिक करने पर मेरी j- स्क्रिप्ट घटना शुरू हो जाती है। मैं प्रयास कर चुका हूं:

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

लेकिन यह ली की आईडी हो जाती है, मुझे एक और ऊपर जाने की जरूरत है, और मैं क्लिक को ली में संलग्न कर सकता हूं।

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> नहीं होगा।

— केसी फोस्टर

सहमत है कि 'निकटतम' आदर्श दृष्टिकोण है। पहले इसका एहसास नहीं था, लेकिन कोई भी चयनकर्ता 'उल' के स्थान पर काम कर सकता है।

— होल्डऑफहुंगर

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>

स्निपेट का विस्तार करें

मुझे पता है कि क्या यह मददगार था।

— जुराज गुनीस
स्रोत