使用& # 39;:隐藏# 39;选择器查找jquery中的隐藏元素

Using ':hidden' selector to find hidden elements in jquery

本文关键字:隐藏 元素 jquery 选择器 使用 查找      更新时间:2023-09-26

在jQuery中,我可以使用$(':hidden')来查找隐藏元素,但我不想包含0大小的元素(width=0 and height=0)。

如何实现这一点?

我不能只判断它的大小是否为0,因为如果它的父元素之一是隐藏的,我也想选择它。

例如:

<img id="e1" width="0" height="0" />
<div style="display:none;">
    <img id="e2" width="0" height="0" />
</div>
<script>
    // I want to select "e2",but not "e1"
    var myelems = $('img:hidden');
</script>

我想选择"e2",但不是"e1"

像这样?

if (element.is(':hidden') && element.width() != 0 && element.height != 0) {
   //do some stuff
}

使用过滤器 jquery

$(':hidden').filter(function(){
      return $(this).width()!=0 && $(this).height()!=0;
});

可以尝试使用jQuery的not方法或not选择器来解决您的问题。例如,

$(document).ready(function() {
  console.log($(":hidden").not($("input[width=0],input[height=0]")));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>Check the output in console</h1>
<input type="hidden" name="a1" id="a1" value="a1">
<input type="hidden" name="a2" id="a2" value="a2">
<input type="hidden" name="b1" id="b1" width=0 height=0 value="a3">

试试! !

如果你将style属性设置为display: none;(或使用jQuery的。hide()),你可以使用这个

(演示)

$('*[style*="display: none;"]');
jQuery('elem:hidden').each(function(ind){
if(jQuery(this).height() > 0 && jQuery(this).width() > 0){
console.log(jQuery(this))
}
});