如何使用 . hide () 、.show () 或.toggle () 来切换元素的可见度 ?
如果元素可见或隐藏, 我如何测试 ?
如何使用 . hide () 、.show () 或.toggle () 来切换元素的可见度 ?
如果元素可见或隐藏, 我如何测试 ?
当前回答
如何确定一个混合元素的状态?
您可以使用 : 可见和: 隐藏的选择器来确定元素是否崩溃。
var isVisible = $('#myDiv').is(':visible');
var isHidden = $('#myDiv').is(':hidden');
如果您只是根据一个基于其可见度的元素行事, 您可以只包括: 可见或: 隐藏在选择表达式中。 例如 :
$('#myDiv:visible').animate({left: '+=200px'}, 'slow');
其他回答
isHidden = function(element){
return (element.style.display === "none");
};
if(isHidden($("element")) == true){
// Something
}
通常当检查某物是否可见时, 您会立即直接去做其他事情。 jquery 绑链很容易做到 。
所以,如果您有一个选择器, 并且您想要在它上执行某些动作, 只有当它为可见或隐藏时, 您可以使用过滤器 (“ : 可见 ” ) 或过滤器 (“ 隐藏 ” ) , 然后将它与您想要采取的行动连接起来 。
而不是这样声明:
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" });
i 将使用 cs 类. hide { 显示: 无重要;} 。
对于隐藏/显示, 我调用. addclass (" hide") /. remove class (" hide") /. remove class (" hide") 来检查可见度, 我使用. has class (" hide" ) 。
如果您不打算使用.toggle () 或. animate () 方法, 这是一个简单明了的检查/ 隐藏/ 显示元素的方法 。
因为元素具有可见度: 隐藏或不透明: 0 被视为可见, 因为它们仍然消耗着布局中的空间( 如 jquery 描述为 jquery : 可见选择器) - 我们可以检查元素是否以这种方式真正可见 :
function isElementReallyHidden (el) {
return $(el).is(":hidden") || $(el).css("visibility") == "hidden" || $(el).css('opacity') == 0;
}
var booElementReallyShowed = !isElementReallyHidden(someEl);
$(someEl).parents().each(function () {
if (isElementReallyHidden(this)) {
booElementReallyShowed = false;
}
});
if($('#postcode_div').is(':visible')) {
if($('#postcode_text').val()=='') {
$('#spanPost').text('\u00a0');
} else {
$('#spanPost').text($('#postcode_text').val());
}