JQuery: jeśli div jest widoczny

Question

Używam JS jako sposobu na zmianę zawartości SPA, które tworzę. Po naciśnięciu przycisku, aby zmienić zawartość zmienia HTML to:

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

do tego:

<div id="selectDiv" style> 

teraz częścią mojego SPA ma div, który zawiera szereg pól, z których każda reprezentuje div, a więc po naciśnięciu przycisku submit, następny element div, który powinien zostać wyświetlony, będzie pierwszym elementem na liście checkbox, która została wybrana.

Zastanawiam się, czy istnieje sposób w JQuery dla kodu "prawie wykryć", który div jest teraz widoczny. coś takiego:

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

Wszelkie sugestie?

Answer 1

Można użyć .is(':visible')

Zaznacza wszystkie elementy, które są widoczne.

Na przykład:

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

Ponadto, można uzyskać div, który jest widoczny przez:

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

żywo przykład:

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>