javascript 在jquery中隐藏元素而不将显示设置为none
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18462215/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
hide element without setting the display to none in jquery
提问by Obaid Maroof
I want to fold a section of the form without setting its display
to none
. If i set the display
to none
, the validation is bypassed that is why I don't want to set the display
to none
. I know I can set the visibility to hidden
and visible
but this solution is not feasible for rendering the view as the space for the folded section stays there. This results in a very odd look of the view with an empty white space with no content on it.
我想折叠表单的一部分而不将其设置display
为none
. 如果我设置display
为none
,验证将被绕过,这就是我不想设置display
为的原因none
。我知道我可以将可见性设置为hidden
,visible
但是这个解决方案对于渲染视图是不可行的,因为折叠部分的空间停留在那里。这会导致视图的外观非常奇怪,上面有一个空白区域,上面没有任何内容。
So my question is to hide a section of the html form (without intacting a placeholder for it) without setting its display
to none
, so that I could still perform the validation.
所以我的问题是隐藏 html 表单的一部分(不为其保留占位符)而不将其设置display
为none
,以便我仍然可以执行验证。
Some HTML code:
一些 HTML 代码:
<td style="margin: 5px; border-bottom: 1px solid; display:none; overflow: hidden;" colspan="3">
<div>...</div>
</td>
The display
is initially set to none but once it is unfolded for the first time, I am setting the height
to 100% and removing the display
style.
该display
初始设置为无,但一旦它展开的第一次,我设置height
为100%和去除display
风格。
回答by CodingIntrigue
You can move it off the screen:
您可以将其移出屏幕:
$(elem).css("position", "absolute").css("left", -9999);
Or set it's height to 0:
或将其高度设置为 0:
$(elem).css("height", 0);
回答by Tibos
The simplest way to fake display:none
is by setting the position to absolute (so the element is taken out of flow, no longer influencing the rendering of outside elements) and the visibility to hidden (so it is no longer painted).
最简单的伪造方法display:none
是将位置设置为absolute(这样元素被移出流,不再影响外部元素的渲染)和隐藏的可见性(所以它不再被绘制)。
$(elem).css('visibility', 'hidden').css('position','absolute');
回答by Anil kumar
Set the opacity of the element to 0.
将元素的不透明度设置为 0。
$(elem).css("opacity", 0);
回答by Anil kumar
$("#ele").css({"height" : 0, "width" : 0, "opacity" : 0});
回答by TzoLy
Hiding an element with jquery...
使用 jquery 隐藏元素...
$('element').addClass('hidden');
and in your CSS just use what ever you find appropriate to make that element "hidden"
并在您的 CSS 中使用您认为合适的任何内容来“隐藏”该元素
.hidden{
/* whatever you find appropriate */
}