如何使元素的可见度.hide(), .show(),或.toggle()?
如果一个元素是visible或hidden?
当前回答
要检查它是否不可见, 我使用它!:
if ( !$('#book').is(':visible')) {
alert('#book is not visible')
}
或以下是 sam, 将 jQuery 选择器保存在一个变量中, 以便在您需要它多次时有更好的性能 :
var $book = $('#book')
if(!$book.is(':visible')) {
alert('#book is not visible')
}
其他回答
$(document).ready(function() {
if ($("#checkme:hidden").length) {
console.log('Hidden');
}
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="checkme" class="product" style="display:none">
<span class="itemlist"><!-- Shows Results for Fish --></span> Category:Fish
<br>Product: Salmon Atlantic
<br>Specie: Salmo salar
<br>Form: Steaks
</div>由于问题只涉及一个要素,本守则可能更适合:
// Checks CSS content for display:[none|block], ignores visibility:[true|false]
$(element).is(":visible");
// The same works with hidden
$(element).is(":hidden");
与twernt的建议,但适用于单一个元素;并且匹配 jQuery FAQ 中推荐的算法.
我们用jQuery的是( )将选中的元素与其它元素、选择器或任何 jQuery 对象一起检查。此方法沿 DOM 元素沿 DOM 元素查找匹配,该匹配符合所传递的参数。如果匹配,则返回为真实,否则返回为虚假。
您可以在显示或隐藏 CSS 类时使用该类的 CSS 类 :
.show{ display :block; }
设置您的j查询toggleClass()或addClass()或removeClass();.
例如,
jQuery('#myID').toggleClass('show')
上述代码将添加show当元素没有 cs 元素时 cs 类show当它消逝的时候,show类。
当你在检查它是否可见, 你可以遵循这个 JQuery 代码,
jQuery('#myID').hasClass('show');
上面的代码将返回布尔值( true) 时返回布尔值#myID元素中含有我们的类(show当它没有的时候,是假的,show类。
下面的代码检查元素是否隐藏在 jQuery 中或可见
// You can also do this...
$("button").click(function(){
// show hide paragraph on button click
$("p").toggle("slow", function(){
// check paragraph once toggle effect is completed
if($("p").is(":visible")){
alert("The paragraph is visible.");
} else{
alert("The paragraph is hidden.");
}
});
});
