如何使用jQuery更改CSS显示“无”或“阻止”属性?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (10)
  • 关注 (0)
  • 查看 (171)

如何使用jQuery更改CSS显示“无(none)”或“块(block)”属性?

提问于
用户回答回答于

正确的使用showhide方法:

$('#id').hide();
$('#id').show();

另一种方法是用jQuery的CSS方法:

$("#id").css("display", "none");
$("#id").css("display", "block");
用户回答回答于

一个元素隐藏或者显示,取决于该元素的可见性,您可以使用toggle来替换.hide() 和 .show()方法

$('elem').toggle();

用户回答回答于

.hide() 在 Chrome中不起作用,下面是为了隐藏在Chrome浏览器中:

var pctDOM = jQuery("#vr-preview-progress-content")[0];
pctDOM.hidden = true;
用户回答回答于

用这个

$("#id").(":display").val("block");

$("#id").(":display").val("none");
用户回答回答于
(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);
用户回答回答于

使用jQuery CSS方法实现此操作:

$("#id").css({display: "none"});
$("#id").css({display: "block"});
用户回答回答于

用于隐藏(hide):

$("#id").css("display", "none");

用于显示(show):

$("#id").css("display", "");
用户回答回答于

简单的实例:

function displayChange(){
$(content_id).click(function(){
  $(elem_id).toggle();}

)}
用户回答回答于

如果div的显示默认为块,则只需使用.show()、.hide()或者更简单的方法.toggle()改变它的可见性。

用户回答回答于

实现这个目的的方法有很多,每种方法都有自己预期的目的。

)使用inline, 当简单地为一个元素分配一个事务列表时

$('#ele_id').css('display', 'block').animate(....
$('#ele_id').css('display', 'none').animate(....

)设置多个CSS属性时使用

$('#ele_id').css({
    display: 'none'
    height: 100px,
    width: 100px
});
$('#ele_id').css({
    display: 'block'
    height: 100px,
    width: 100px
});

)动态调用命令

$('#ele_id').show();
$('#ele_id').hide();

)在块(block)和无(none)之间动态切换,如果是div

  • 某些元素显示为 inline, inline-block, 或者 table 时,具体取决于标签名

$('#ele_id').toggle();

扫码关注云+社区

领取腾讯云代金券