如何使用Jquery更改css display none或block属性?

时间:2010-08-27 08:52:29

标签: jquery jquery-selectors

如何使用Jquery更改css display none或block属性?

14 个答案:

答案 0 :(得分:799)

执行此操作的正确方法是使用showhide

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

另一种方法是使用jQuery css方法:

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

答案 1 :(得分:101)

有几种方法可以实现这一目标,每种方法都有自己的预期用途。


1 。)使用内联,只需为元素分配要做的事情列表

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

2 。)在设置多个CSS属性时使用

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

3 。)动态调用命令

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

4 。)要在块和无之间动态切换,如果它是div

  • 根据Ta g N ame
  • ,某些元素会显示为内嵌,内联块或表格
  

$( '#ele_id')切换();

答案 2 :(得分:27)

如果div的显示默认为阻止,您可以使用.show().hide(),甚至更简单的.toggle()来切换可见性。

答案 3 :(得分:5)

简单方法:

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

)}

答案 4 :(得分:5)

表示隐藏:

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

表示:

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

答案 5 :(得分:4)

使用jQuery CSS方法执行此操作的其他方法:

$("#id").css({display: "none"});
$("#id").css({display: "block"});

答案 6 :(得分:1)

(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);

答案 7 :(得分:1)

如果您想隐藏和显示元素,具体取决于它是否已经可见,您可以使用切换:.hide()和.show()

$(' ELEM&#39)。切换();

答案 8 :(得分:0)

使用此

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

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

答案 9 :(得分:0)

.hide()在Chrome中无效 这适用于隐藏:

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

答案 10 :(得分:0)

在我的情况下,我正在根据输入元素是否为空来显示/隐藏表单的元素,以便在隐藏元素时,将隐藏元素之后的元素重新定位,以占用其空间。浮点数:此类元素的元素的左侧。即使使用插件作为dependsOn,也必须使用float。

答案 11 :(得分:0)

使用:

VideoCapture cap;
    int device_counts = 0;
    while ( true ) {
        if ( !cap.open(device_counts++) ) {
            break;
        }
    }

这是最好的方法。

答案 12 :(得分:0)

在javascript中:

document.getElementById("myDIV").style.display = "none";

和在jQuery中

$("#myDIV").css({display: "none"});
$("#myDIV").css({display: "block"});

您可以使用:

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

答案 13 :(得分:-1)

您可以通过按钮完成

<button onclick"document.getElementById('elementid').style.display = 'none or block';">