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

Question

如何从内部div中获取id。 我有许多class为control的div，但我想获得父div的id。 如何获取？

http://jsfiddle.net/cngt2ef6/7/

$(".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>

- Kanaka k

---

将.closest('div').hasClass("control)更改为.closest('div.control')。 - Ram

你可以使用 jQuery 的 .parents() 方法。 $(this).parents(".control").attr("id"); - Awais Ashraf

Answer 1

问题出在于：

1. closest选择器会返回第一个父级div（这不是我们需要的）。
2. hasClass()方法会返回一个布尔值，表示元素是否具有给定的类（在您的情况下，第一个父元素没有给定的control类）。

您需要直接在closest()方法中使用class选择器，而不是使用hasClass()方法，如下所示：

$(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:

- Zakaria Acharki

---

@ Zakaria：你能回答这个问题吗：https://stackoverflow.com/questions/52424524/how-to-call-a-function-inside-same-function-and-outside-in-javascript - Kanaka k

Answer 2

除了已经提到的返回第一个单一节点父级的closest()之外，您还可以使用parents()，但在这种情况下，它将返回具有目标元素/类/ID的多个节点。在这种情况下，它只是closest()的替代方法。

$(".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>

- dippas

---

你可以这样做，但在这里并不相关 - 你应该指出.closest()找到最近的单个父节点，而.parents()可能会返回多个节点。 - freedomn-m

在这种情况下，没有多个节点，因此我认为不需要提到 :) - dippas

在搜索单个祖先时，最好使用closest()函数，因为它会在找到第一个匹配项后停止搜索。 - Rory McCrossan

未来问题：我从^^这里^^得到了这个答案，并且它说明我可以使用.parents()作为.closest()的完全替代品 - 为什么我会得到多个结果？请详细说明。 - freedomn-m

@RoryMcCrossan 我的朋友，我完全知道这一点，我只是提供另一个选项。 - dippas

不错的替代方案 :) - freedomn-m