如何使用 jQuery 更改 CSS display none 或 block 属性?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3582619/
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
How can I change CSS display none or block property using jQuery?
提问by DEVOPS
How can I change CSS display none or block property using jQuery?
如何使用 jQuery 更改 CSS display none 或 block 属性?
回答by djdd87
回答by SpYk3HH
There are several ways to accomplish this, each with its own intended purpose.
有多种方法可以实现这一点,每种方法都有自己的预期目的。
1.) To use inlinewhile simply assigning an element a list of things to do
1.) 使用内联,同时简单地为元素分配要做的事情列表
$('#ele_id').css('display', 'block').animate(....
$('#ele_id').css('display', 'none').animate(....
2.) To use while setting multiple CSS properties
2.) 在设置多个 CSS 属性时使用
$('#ele_id').css({
display: 'none'
height: 100px,
width: 100px
});
$('#ele_id').css({
display: 'block'
height: 100px,
width: 100px
});
3.) To dynamically call on command
3.) 动态调用命令
$('#ele_id').show();
$('#ele_id').hide();
4.) To dynamically toggle between block and none, if it's a div
4.) 在块和无之间动态切换,如果它是一个 div
$('#ele_id').toggle();
$('#ele_id').toggle();
回答by reko_t
If the display of the div is block by default, you can just use .show()
and .hide()
, or even simpler, .toggle()
to toggle between visibility.
如果默认情况下 div 的显示是块状的,您可以只使用.show()
和.hide()
,甚至更简单,.toggle()
在可见性之间切换。
回答by Phanikumar Jatavallabhula
For hide:
对于隐藏:
$("#id").css("display", "none");
For show:
用于展示:
$("#id").css("display", "");
回答by Miguel
Other way to do it using jQuery CSS method:
使用 jQuery CSS 方法的其他方法:
$("#id").css({display: "none"});
$("#id").css({display: "block"});
回答by user3726824
Simple way:
简单的方法:
function displayChange(){
$(content_id).click(function(){
$(elem_id).toggle();}
)}
回答by Vladimir verleg
In case you want to hide and show an element, depending on whether it is already visible or not, you can use
toggle instead of .hide()
and .show()
如果你想隐藏和显示一个元素,取决于它是否已经可见,你可以使用 toggle 而不是.hide()
and.show()
$('elem').toggle();
回答by Pham
(function($){
$.fn.displayChange = function(fn){
$this = $(this);
var state = {};
state.old = $this.css('display');
var intervalID = setInterval(function(){
if( $this.css('display') != state.old ){
state.change = $this.css('display');
fn(state);
state.old = $this.css('display');
}
}, 100);
}
$(function(){
var tag = $('#content');
tag.displayChange(function(obj){
console.log(obj);
});
})
})(jQuery);
回答by jimver04
.hide() does not work in Chrome for me.
.hide() 对我来说在 Chrome 中不起作用。
This works for hiding:
这适用于隐藏:
var pctDOM = jQuery("#vr-preview-progress-content")[0];
pctDOM.hidden = true;
回答by Trikaldarshi
Use this:
用这个:
$("#id").(":display").val("block");
Or:
或者:
$("#id").(":display").val("none");