javascript - jQuery hide() メソッドは、display:none で要素を表示します!重要

Question

次の CSS を持つクラスに要素を割り当てました。

.cls {
  display:none !important;
}

この要素をjQueryで表示しようとすると

$(".cls").show();

それは動作しません。

この要素を非表示にするにはどうすればよいですか?

score 48 · Accepted Answer

48

$('.cls').attr('style','display:block !important');

于 2013-09-25T09:16:53.790 に答える

score 5 · Accepted Answer

これを行う2つの方法、

1)クラスからを削除!importantします。.cls

.cls{
   display: none;
}

しかし、これを別の場所で使用していたので、回帰が発生する可能性があると思います。

2)代わりにできることは、別のクラスを持ち、それを切り替えることです。

.cls-show{
  display: block !important;
}

そして、あなたのJavaScriptで、

$('.cls').addClass(".cls-show");

その後、再び非表示にする必要がある場合は、次のことができます。

$('.cls').removeClass('.cls-show');

これにより、マークアップをクリーンで読みやすい状態に保つことができます

score 1 · Accepted Answer

CLS クラスセレクターの唯一のプロパティが表示用のプロパティである場合は、これを行うことができ、余分なクラスを追加したり、インラインスタイルを変更したりする必要はありません。

それらを表示するには:

$('.cls').removeClass("cls").addClass("_cls");

それらを非表示にするには:

$('._cls').removeClass("_cls").addClass("cls");

score 1 · Accepted Answer

！重要; すべてのルールを削除し、 !important;として定義された css を適用します。. したがって、あなたの場合、すべてのルールを無視して display:noneを適用しています。

だからこれをしてください：

.cls {
  display:none
}

6 に答える 6