如何获取当前点击链接的父链接?

时间:2016-10-06 16:54:27

标签: javascript jquery html

我有这个HTML导航:

            <li class="dropdown">
                <a href="#" class="dropdown-toggle grade-title" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">1st Grado <span class="caret"></span></a>
                <ul class="dropdown-menu">
                    <li><a href="#first_grade_anthology" class="nav_pdf_unique_anthology" data-grade="First Grade" data-book-type="Anthology">Antologías</a></li>
                    <!--<li><a href="#first_grade_big_books" class="nav_pdf_list" data-grade="First Grade" data-book-type="Big Books">Big Books</a></li>-->
                    <!--<li><a href="#first_grade_decodable_books" class="nav_pdf_list" data-grade="First Grade" data-book-type="Decodable Books">Decodable Books</a></li>-->
                    <li><a href="#first_grade_a" class="nav_pdf_units" data-grade="First Grade" data-book-type="A">A</a></li>
                    <li><a href="#first_grade_o" class="nav_pdf_units"data-grade="First Grade" data-book-type="O">O</a></li>
                    <li><a href="#first_grade_b" class="nav_pdf_units" data-grade="First Grade" data-book-type="B">B</a></li>
                    <!--<li><a href="#first_grade_trade_books" class="nav_pdf_list" data-grade="First Grade" data-book-type="Trade Books">Trade Books</a></li>-->
                </ul>
            </li>
            <li class="dropdown">
                <a href="#" class="dropdown-toggle grade-title" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">2nd Grado <span class="caret"></span></a>
                <ul class="dropdown-menu">
                    <li><a href="#second_grade_anthology" class="nav_pdf_unique_anthology" data-grade="Second Grade" data-book-type="Anthology">Antologías</a></li>
                    <!--<li><a href="#second_grade_decodable_books" class="nav_pdf_list" data-grade="Second Grade" data-book-type="Decodable Books">Decodable Books</a></li>-->
                    <li><a href="#second_grade_a" class="nav_pdf_units" data-grade="Second Grade" data-book-type="A">A</a></li>
                    <li><a href="#second_grade_o" class="nav_pdf_units" data-grade="Second Grade" data-book-type="O">O</a></li>
                    <li><a href="#second_grade_b" class="nav_pdf_units" data-grade="Second Grade" data-book-type="B">B</a></li>
                    <!--<li><a href="#second_grade_trade_books" class="nav_pdf_list" data-grade="Second Grade" data-book-type="Trade Books">Trade Books</a></li>-->
                </ul>

当用户点击带有href =“#”的下拉列表时,它会下拉包含所有其他链接的菜单。

我要做的是在用户点击其中一个链接时获取该初始锚点的文本。

例如,如果他们点击了一年级 - &gt;然后'O',我想得到'一年级'的文字。

实现这一目标的最佳方法是什么?

1 个答案:

答案 0 :(得分:4)

  

.closest() - 对于集合中的每个元素,通过测试元素本身和在DOM树中遍历其祖先来获取与选择器匹配的第一个元素。

     

.find() - 获取当前匹配元素集中的每个元素的后代,由选择器,jQuery对象或元素过滤。

使用 -

$(this).closest('li.dropdown').find('.grade-title').text();