jQuery hasClass匹配元素

Question

在jQuery中，我可以将“closest”或“parents()”与“hasClass”结合使用，以便在页面上存在给定类的最接近元素，如果存在的话？

var matchingDiv = $(this).closest('div').hasClass('SomeClass')

if ( matchingDiv != null )
{
   //we found matching element now manipulate it

}

我将始终拥有一个匹配的 div 元素，或者没有。

谢谢。

- Victor

Answer 1

var matchingDiv = $(this).closest('div.SomeClass')

if ( matchingDiv.length )
{
   // use length to find if there was a match.
   // closest() will always return an object.
}

如果这样做不起作用，可以尝试发布一些HTML代码。也许那里有问题？

- user113716

---

它确实有效，非常感谢。文档说明如果没有找到匹配的元素，则返回null。 - Victor

@Patrick，你也可以缩短为if (matchingDiv.length)，因为0会被评估为false。 - Doug Neiner

@Doug，非常正确。更加简洁明了是好的。我会进行修正。 - user113716

@VictorS - 实际上，closest() 的文档说明中写道：“返回的 jQuery 对象包含零个或一个元素”。（我不得不查一下。）无论如何，你都会得到一个对象。 - user113716

Answer 2

试试这个，closest 可以接受一个选择器：

var matchingDiv = $(this).closest('div.SomeClass')

if ( matchingDiv != null )
{
   //we found matching element now manipulate it

}

- kmehta

---

我之前尝试过，但不知道原因它没有起作用，我认为它应该可以。 - Victor

奇怪的是，这个怎么样： $(this).parents('div').find('.SomeClass:first') - kmehta

这样不行。你的空值测试总是为真，即使没有匹配项。 - user113716

那似乎是这样的情况，那我应该如何更改测试来使其有效？ - Victor

@VictorS - 我已经添加了一个带有适当测试的答案。 - user113716

Answer 3

Closest 接受一个选择器，因此您可以这样做：

 var matchingDiv = $(this).closest('div.SomeClass')

你下一行有个问题，你应该这样检查 jQuery 的结果：

if ( matchingDiv.length )
{
    //we found matching element now manipulate it
}

- Naeem Sarfraz

Answer 4

如果您需要检查当前元素本身是否可能是您正在寻找的祖先... 您可以使用以下方式结合 is() 和 closest()：

var matchingDiv = $(this).closest('.SomeClass');

matchingDiv = matchingDiv.length == 0 ? (matchingDiv.is('.SomeClass') ? matchingDiv : null) : matchingDiv

if ( matchingDiv != null )
{
   //found matching element 

}

- Robin Maben

Answer 5

你是在问这个能否工作吗？

就我个人而言，我认为可以，因为jQuery范式基于将jQuery函数链接在一起。

- Vivin Paliath

Answer 6

最接近的文档

var matchingDiv = &(this).closest('.SomeClass')

if ( matchingDiv != null )
{
   //we found matching element now manipulate it

}

- andres descalzo

---

听起来他特别想要一个带有类的“div”元素。 - user113716

@Patrick，我已经包含了“closest”文档的链接，我认为@VictorS可以查看文档并完成您所需的内容。 - andres descalzo

Answer 7

closest() 和 parents() 的区别在于，如果选择器匹配多个元素，parents() 可以提供多个元素。（这里说的不一定有多大用处）

- Pointy