Question

我正在尝试在单击链接时捕获第3个父级的ID属性的值。例如：

<div id="First Div">
  <div class="class A">
    <div class="class B"></div>
    <div class="class C"></div>
    <div class="class D">
        <i class="link A">Clickable Element</i>
    </div>   
  </div>
</div>

单击“可点击元素”时，我需要在变量中存储值“First Div”。

Answer 1

首先，id不应包含空格而是添加下划线。

您可以将点击事件附加到班级link，然后点击前往拥有属性id的家长并将其保存在变量中：

$('.link').on('click', function(){
    var id_attribute=$(this).closest('div[id]').prop('id');
})

这会有所帮助。

＆＃13;

$('.link').on('click', function(){
    var id_attribute=$(this).closest('div[id]').prop('id');
    
    alert(id_attribute);
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="First_Div">
  <div class="class A">
    <div class="class B"></div>
    <div class="class C"></div>
    <div class="class D">
        <i class="link A">Clickable Element</i>
    </div>   
  </div>
</div>

＆＃13;

Answer 2

您可以使用以下方式执行此操作：

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

但它不是一个好的解决方案，因为你需要确保那些父母确实存在。

Answer 3

你可以使用jquery的parents（）方法，它会遍历DOM，直到找到匹配为止。

$(this).parents().find('div#First_div').attr('id');

http://api.jquery.com/parents/

如何获取第3个父级的ID属性值

3 个答案: