JQuery: если div видимый

Я использую JS как способ изменения содержимого SPA, который я создаю. Когда я нажимаю кнопку, чтобы изменить содержимое, изменение html:

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

:

<div id="selectDiv" style>

Теперь часть моего SPA имеет div, который содержит несколько флажков, каждый из которых представляет div, и поэтому, когда я нажимаю кнопку отправки, следующий div, который должен отображаться, будет первым элементом в списке флажков, который был выбран.

Мне интересно, есть ли способ в JQuery, чтобы код "почти обнаружил", который теперь виден. что-то вроде этого:

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

Любые предложения?

ОТВЕТЫ

Ответ 1

Вы можете использовать .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>