javascript - 如何用jquery获取子菜单中li的父级值？

Question

我创建子菜单，我需要获取子菜单“li”的直接父菜单的值 这是我的代码

 <div class="box"> 

 <div class="col-sm-6">
 <!-- main menu-->
            <ul>
            <li class="m-sub">   

                   Cars
        <!-- sub menu for cars-->   
        <ul class="sub">
            <li> Audi</li>
            <li> KiA</li>
        </ul>
    </li>
                 <li class="m-sub">   

                    Tablets    
      <!--start sub menu for tablet -->
        <ul class="sub">
            <li>   Phone</li>
            <li>  Sony</li>
        </ul>
    </li>
    <li>  Laptop</li>
    <li>   Glass </li>

    </ul>
             </div>
         </div>

例如，我需要获得索尼的直接父级，当我使用 ($(this).parent()).text() 时，结果是手机而不是平板电脑。 我需要获得父“平板电脑”的值(value)，当选择奥迪时我需要获得汽车 提前致谢。

Answer 1

Tablets 不在列表项的直接父项内；你需要更多的 jQuery:

var li = $('.sub > li')

console.log(
  li.closest('.m-sub').contents().eq(2).text().trim() //=> 'Tablets'
)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li class="m-sub">
    <span><i class="icon-tablet"></i></span> Tablets <span class="leftarr"><i class="icon-chevron-right"></i></span>
    <ul class="sub">
      <li> Phone
      </li>
      <li> Sony
      </li>
    </ul>
  </li>
  <li> Laptop
  </li>
  <li> Glass
  </li>

</ul>