web-dev-qa-db-ja.com

JQuery：divが表示されている場合

私が作成しているSPAのコンテンツを変更する方法としてJSを使用しています。コンテンツを変更するためにボタンを押すと、HTMLは次のように変更されます。

<div id="selectDiv" style="display: none;">

これに：

<div id="selectDiv" style>

SPAの一部には、それぞれがdivを表すいくつかのチェックボックスを含むdivがあります。したがって、送信ボタンを押すと、表示される次のdivが、選択されたチェックボックスリストの最初のアイテムになります。

どのdivが現在表示されているかを「ほとんど検出」するコードの方法がJQueryにあるのではないかと思っています。このようなもの：

if($('#selectDiv').isVisible()){
    //JS code associated with this div.
}

助言がありますか？

javascriptjqueryhtmlcsscheckbox
54
Mark

.is(':visible') を使用できます

表示されているすべての要素を選択します。

例えば：

if($('#selectDiv').is(':visible')){

また、次の方法で表示されるdivを取得できます。

$('div:visible').callYourFunction();

ライブの例：

console.log($('#selectDiv').is(':visible'));
console.log($('#visibleDiv').is(':visible'));
#selectDiv {
  display: none;  
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="selectDiv"></div>
<div id="visibleDiv"></div>
82
Mosh Feu