通过jquery在子元素上单击时获取元素上的元素

Question

我有这样的清单：

<ul id="navmenu-v">
  <li class="level1"><a id="56" class="s1">Accessories</a>
    <ul class="level2">
       <li><a id="232" class ='s2'>Apple</a></li>
       <li><a id="231" class ='s2'>Mango</a></li>
       <li><a id="154" class ='s2'>Orange</a></li>
    </ul>
  </li>
  <li class="level1"><a id="63" class="s1">Componet</a>
    <ul class="level2">
       <li><a id="129" class ='s2'>Leave</a></li>
       <li><a id="658" class ='s2'>Tree</a></li>
       <li><a id="158" class ='s2'>Roof</a></li>
    </ul>
  </li>
</ul>

当我点击类s2时，如何获取类s1的id，例如56和63？

谢谢你。

Answer 1

$(".s2").click(function() {
  console.log($(this).closest(".level1").find(".s1").attr("id"));
});

旁注：

根据html规范，

id不能以数字开头。

Answer 2

你可以做到

$('.s2').click(function(){
   alert($(this).closest('.level1').find('a.s1').attr('id'));
});