jquery 从 li 获取 data-id

【问题标题】：jquery get data-id from lijquery 从 li 获取 data-id
【发布时间】：2021-07-25 10:54:00
【问题描述】：

我需要从li 中的href 点击获得data-id。但是 ul、li 和 href 没有 id。他们确实有很长的类名。例如：

<ul class="a-long class-name">
   <li class="a-long-li class-name" data-id="99">
      <div class="generic-button">
         <a href="#" class="button edit edit-item secondary-action my-tooltip"> 
            <span class="edit-label">Edit</span>
         </a>
      </div>
   </li>
</ul>

当在li 中单击href 时，我将如何获得data-id？

我无法更改或添加任何元素或属性。

【问题讨论】：

标签： jquery html-lists

【解决方案1】：

您可以使用data-id 属性作为选择器的一部分

$('li[data-id] a').click(function(e){
   const id = $(this).closest('li').data('id');
   console.log('ID:', id);
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="a-long class-name">
   <li class="a-long-li class-name" data-id="99">
      <div class="generic-button">
         <a href="#" class="button edit edit-item secondary-action my-tooltip"> 
            <span class="edit-label">Edit</span>
         </a>
      </div>
   </li>
</ul>

【讨论】：