jquery .closest（）在尝试访问最近的上部div时选择自己

Question

Hello实际上我想要的是隐藏div元素的直接上部div，如果它是空的

所以我写了这样的代码

if ($.trim($('#searchQuery').html()) == '') {

    $('#searchQuery').closest("div").css("display", "none");
}

id searchQuery元素本身就是div，所以它正在隐藏自己。

任何人都知道在这种情况下该做什么，为什么它的行为是这样的？

Answer 1

一些事情：

• 使用.text()代替.html()，以避免获取不会在修剪中移除的HTML标记。
• 使用.hide()代替.css("display", "none")。
• 使用.parent()作为直接父母。

示例解决方案：

$('#searchQuery').parent().hide();

• 有关jQuery .parent()
的更多信息
• 有关jQuery .hide()
的更多信息

Answer 2

或者您可以使用:not(..)。

$('#searchQuery').closest("div:not(#searchQuery)").hide();

http://api.jquery.com/not-selector/

它选择自己因为它

  

开始使用当前元素

http://api.jquery.com/closest/

或者你可以使用.parents(...)（注意最后的s）。它通过DOM树传播，直到找到你在参数中传递的选择器。

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

Answer 3

请参阅Jquery .closest()文档。

Jquery .closest（）

对于集合中的每个元素，通过测试元素本身并遍历DOM树中的祖先来获取与选择器匹配的第一个元素。

1 .Begins with the current element

您的选择器[.closest("div")]引用当前元素#searchQuery

2. Travels up the DOM tree until it finds a match for the supplied selector

#searchQuery是DOM树中的第一个元素，它与当前选择器[.closest("div")]完美匹配

<强>更新

您可以在此使用.parent()，.prev()选择器而不是.closest()。

或者您可以将.closest()选择器与.not()选择器一起使用。

Answer 4

为什么不简单呢？

$('#searchQuery').parent("div").css("display", "none");

顺便说一句，正如trgraglia注意到的那样，你也应该使用hide：

$('#searchQuery').parent("div").hide();

Answer 5

取决于你的意思“上层div”

如果是以前的兄弟姐妹：

$('#searchQuery').prev().css("display", "none");

或父母：

$('#searchQuery').parent().css("display", "none");

Answer 6

使用.parent（）而不是最接近：）

Answer 7

这是一个老问题，但我今天遇到了同样的问题并通过以下方式解决了这个问题：

$myelement.parent().closest('div');

这将忽略$ myelement并查看它上面