web-dev-qa-db-ja.com

JQueryを使って、要素が 'display：none'かクリックでブロックかをチェックします

隠されている要素をチェックして並べ替えます。属性displayと値noneを持つすべての要素を見つけることは可能ですか？

jquerycss
201
Nicholas Francis

表示要素には ：visible を、隠し要素を見つけるには ：hidden を使用することができます。この隠し要素のdisplay属性はnoneに設定されています。

hiddenElements = $(':hidden');
visibleElements = $(':visible');

特定の要素を確認します。

if($('#yourID:visible').length == 0)
{

}

要素がドキュメント内のスペースを消費する場合、その要素は表示されていると見なされます。表示されている要素の幅または高さが0より大きい。 参照

:visibleと一緒に is（） を使うこともできます。

if(!$('#yourID').is(':visible'))
{

}

表示の値を確認したい場合は、 css（） を使用できます。

if($('#yourID').css('display') == 'none')
{

}

Displayを使用している場合は、displayがとり得る以下の値が表示されます。

表示：なし

表示：インライン

表示ブロック

表示：リスト項目

表示：インラインブロック

可能なdisplay値の完全なリストをチェックしてください ここ 。

JavaScriptでdisplayプロパティを確認する

var isVisible = document.getElementById("yourID").style.display == "block";
var isHidden = document.getElementById("yourID").style.display == "none";
471
Adil
$("element").filter(function() { return $(this).css("display") == "none" });
48
Deepanshu Goyal

はい、あなたはcssfunctionを使うことができます。以下はすべてのdivを検索しますが、あなたが必要とするどんな要素でもあなたはそれを修正することができます

$('div').each(function(){

    if ( $(this).css('display') == 'none')
    {
       //do something
    }
});
26
jjhavokk
$('#selector').is(':visible');
10
Barry Chapman

可視性をチェックするjQueryには2つのメソッドがあります。

$("#selector").is(":visible")

そして

$("#selector").is(":hidden")

セレクタの表示設定に基づいてコマンドを実行することもできます。

$("#selector:visible").hide()

または

$("#selector:hidden").show()
10
Luceos

この条件を使用してください。

if (jQuery(".profile-page-cont").css('display') == 'block'){
    // Condition 
}
10
Rana