如何使用jquery从div内部获取id

How to get the id from the inside div. I have many div with class control but I want to get parent div id. How to get?

如何从内部div获取id。我有很多div与类控件但我想得到父div id。如何获得?

$(".getid").click(function() {
   alert($(this).closest('div').hasClass("control).attr("id"))
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="control" id="spa">
  Content
</div>
<div class="control" id="test">
  <div class="method">
    <a href="#" class="getid">Getid</a>
  </div>
</div>
<div class="control" id="awesome">
  Content
</div>

2 个解决方案

#1

The problem comes from :

问题来自:

The closest selector that will return the first parent div (what is not what we need here).

最接近第一个父div的选择器(这不是我们需要的)。

The hasClass() since it will return a boolean if the element has the given class or not. (in your case the first parent doesn't have the given class control)

hasClass()因为如果元素具有给定的类,它将返回一个布尔值。 (在您的情况下,第一个父级没有给定的类控件)

Instead of using hasClass() you need to use the class selector directely in the closest() method like:

您不需要使用hasClass(),而是需要在nearest()方法中直接使用类选择器,如:

$(this).closest('div.control').attr("id");

$(".getid").click(function() {
  console.log($(this).closest('div.control').attr("id"));
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="control" id="spa">
  Content
</div>
<div class="control" id="test">
  <div class="method">
    <a href="#" class="getid">Getid</a>
  </div>
</div>
<div class="control" id="awesome">
  Content
</div>
Js:

#2

Besides closest() - which return the first single node parent - already mentioned you can use parents() , but in this case will return multiple nodes with the element/class/id targeted.

除了nearest() - 返回第一个单节点父节点 - 已经提到过你可以使用parents(),但在这种情况下将返回多个节点,其中元素/ class / id是目标。

It is just an alternative to closest() in this case scenario

在这种情况下,它只是nearest()的替代方案

$(".getid").click(function() {
  console.log($(this).parents('.control').attr("id"))
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="control" id="spa">
  Content
</div>
<div class="control" id="test">
  <div class="method">
    <a href="#" class="getid">Getid</a>
  </div>
</div>
<div class="control" id="awesome">
  Content
</div>

#1