当我不确定元素在可见时使用display:block时,显示切换的替代方法?

像这样做

if (show)
    $('.some-element').css('display', '');
else
    $('.some-element').css('display', 'none');

此代码( $('.some-element').css('display', ''); )将删除内联 display: none 属性,当不需要时。

jquery已经为您解决了这个问题 toggle , show 和 hide :

$('.some-element').toggle(show);

或

if (show) {
    $('.some-element').show();
} else {
    $('.some-element').hide();
}

我通常使用一个类来表示隐藏状态,因为 做 知道当元素被隐藏时 display 属性应该是 none .

.whatever {
  // normal rules
}

.whatever.hidden {
  display: none;
}

然后通过添加或删除“hidden”类来操作元素的可见性。因为您的规则不影响元素的可见规则,所以可以 display: inline; 或 display: table-cell; 或者别的什么。

当存在内联的“样式”属性时,这种方法可能会变得复杂;这是我通常不喜欢代码中那些属性的原因。

使用的另一种选择 显示 是给元素一个远离可见页面的绝对位置:

.whatever.hidden {
  position: absolute;
  left: -10000px;
}

这对于需要不可见但也需要作为表单字段实际工作的表单字段非常有用。尤其是Internet Explorer不喜欢不可见( display: none )输入,但是屏幕外的输入是可以的。