如何使用 jQuery 检查元素是否可见
答案:使用 jQuery :visible 选择器
您可以使用 jQuery :visible 选择器来检查元素在布局中是否可见。 此选择器还将选择具有 visibility: hidden; 或 opacity: 0; 的元素，因为它们在布局中保留了空间，即使它们对眼睛不可见。
让我们看一个例子来了解这个选择器的基本工作原理:
示例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery 测试是否一个元素可见</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
/* 单击按钮时显示隐藏段落 */
$("p").toggle("slow", function(){
/* 切换效果完成后检查段落 */
if($("p").is(":visible")){
alert("The paragraph is visible.");
} else{
alert("The paragraph is hidden.");
}
});
});
});
</script>
</head>
<body>
<button type="button">Toggle Paragraph Display</button>
<p style="display: none;">Lorem ipsum dolor sit amet adipi elit...</p>
</body>
</html>FAQ 相关问题解答
以下是与此主题相关的更多常见问题解答:
- 如何使用jQuery检查元素是否隐藏
- 如何使用 jQuery 选择页面中所有可见或隐藏的元素
- 根据 jQuery 中单选按钮的选择显示和隐藏 DIV 元素
- 在 jQuery 中基于复选框的点击显示和隐藏 DIV 元素
- 在 jQuery 中基于下拉选择显示和隐藏 DIV 元素
