web-dev-qa-db-ja.com

Jqueryを使用してcss display noneまたはblockプロパティを変更する方法

Jqueryを使用してcss display noneまたはblockプロパティを変更する方法

jqueryjquery-selectors
374
learner

これを行う正しい方法は、showとhideを使用することです。

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

別の方法はjQuery css メソッドを使うことです：

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

これを達成するにはいくつかの方法があり、それぞれに目的があります。

1 ）要素に単にやることのリストを割り当てながらinlineを使うには

$('#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の場合、ブロックとnoneを動的に切り替える

  • 一部の要素は、 Tag Name に応じて、インライン、インラインブロック、またはテーブルとして表示されます

$（ '＃ele_id'）。toggle（）;

101
SpYk3HH

Divの表示がデフォルトでブロックされている場合は、.show()と.hide()、あるいはさらに簡単な.toggle()を使用して表示を切り替えることができます。

27
reko_t

簡単な方法：

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

)}
5
user3726824

隠すために：

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

ショー用：

$("#id").css("display", "");
5
Phanikumar Jatavallabhula

JQuery CSSメソッドを使用してそれを行う他の方法：

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

既に表示されているかどうかに応じて要素を隠したり表示したい場合は、代わりにtohle（：.hide（）と.show（））を使用できます。

$（ 'elem'）。toggle（）;

1
Peter verleg

.hide（）はChromeでは機能しません

var pctDOM = jQuery("#vr-preview-progress-content")[0];
pctDOM.hidden = true;
1
jimver04
(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);
1
Pham

私の場合は、入力要素が空かどうかに応じてフォームの要素を表示/非表示にしていました。そのため、要素を非表示にしたときそのような要素の要素の。 dependsOnとしてプラグインを使用する場合でも、floatを使用する必要がありました。

0
user2341112

これを使って

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

または

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