如何使元素的可见度.hide()
, .show()
,或.toggle()
?
如果一个元素是visible
或hidden
?
如何使元素的可见度.hide()
, .show()
,或.toggle()
?
如果一个元素是visible
或hidden
?
当前回答
其他回答
$( "div:visible" ).click(function() {
$( this ).css( "background", "yellow" );
});
$( "button" ).click(function() {
$( "div:hidden" ).show( "fast" );
});
API 文献资料:可见可见选择器
if($(element).is(":visible")) {
console.log('element is visible');
} else {
console.log('element is not visible');
}
检查隐藏元素的方法太多。 这是最好的选择( 我只是推荐你):
使用 jQuery, 在 CSS 中设定隐藏的元素“ 播放: noone ” 。
重点是:
$('element:visible')
以及一个可供使用的例子:
$('element:visible').show();
通常当检查某物是否可见时, 您会立即直接去做其他事情。 jQuery 链条让事情变得容易。
所以,如果您有一个选择器, 并且只有显示或隐藏时才想要对它执行某些动作, 您可以使用filter(":visible")
或filter(":hidden")
然后用您想要采取的行动链绑住它。
所以,而不是一个if
语句, 像这样的语句 :
if ($('#btnUpdate').is(":visible"))
{
$('#btnUpdate').animate({ width: "toggle" }); // Hide button
}
或更有效率,但更丑陋:
var button = $('#btnUpdate');
if (button.is(":visible"))
{
button.animate({ width: "toggle" }); // Hide button
}
你可以单行完成所有任务:
$('#btnUpdate').filter(":visible").animate({ width: "toggle" });
就是这样jj 查询内部解决这个问题 :
jQuery.expr.pseudos.visible = function( elem ) {
return !!( elem.offsetWidth || elem.offsetHeight || elem.getClientRects().length );
};
如果您不使用 jQuery, 您可以使用这个代码, 并将其转换为您自己的功能 :
function isVisible(elem) {
return !!( elem.offsetWidth || elem.offsetHeight || elem.getClientRects().length );
};
哪个isVisible
将返回true
只要元素是可见的。