javascript - document.ready原生 - 如何在jQuery中检查一个元素是否被隐藏?

JavaScript document ready / javascript / jquery / dom / visibility

是否有可能进行切换的元件的可见性,使用函数 .hide().show().toggle()

Nicolas Gervais



Answer #1

opacity:0 将元素隐藏为“ visibility:hidden”,并且仍然占据布局中的空间;唯一的区别是不透明度使一个元素可以部分透明;

opacity:0 将元素隐藏为“ visibility:hidden”,并且仍然占据布局中的空间;唯一的区别是不透明度使一个元素可以部分透明;

if ($('.target').is(':hidden')) {
  $('.target').show();
} else {
  $('.target').hide();
}
if ($('.target').is(':visible')) {
  $('.target').hide();
} else {
  $('.target').show();
}

if ($('.target-visibility').css('visibility') == 'hidden') {
  $('.target-visibility').css({
    visibility: "visible",
    display: ""
  });
} else {
  $('.target-visibility').css({
    visibility: "hidden",
    display: ""
  });
}

if ($('.target-visibility').css('opacity') == "0") {
  $('.target-visibility').css({
    opacity: "1",
    display: ""
  });
} else {
  $('.target-visibility').css({
    opacity: "0",
    display: ""
  });
}

有用的jQuery切换方法:

$('.click').click(function() {
  $('.target').toggle();
});

$('.click').click(function() {
  $('.target').slideToggle();
});

$('.click').click(function() {
  $('.target').fadeToggle();
});