Как посчитать «видимые» вкладки в jquery?

Question

Я унаследовал этот код и теперь должен внести изменения. У меня есть серия вкладок:

<div id="Tabs">
    <ul>
        <li><a href="#divGen" id="lnkGeneral">General</a></li>
        <li><a href="#divA" id="lnkA">A</a></li>
        <li><a href="#divB" id="lnkB">B</a></li>
        <li><a href="#divC" id="lnkC">C</a></li>
    </ul>
</div>

Они скрыты / показаны с использованием jquery в зависимости от значения, выбранного из раскрывающегося списка:

$("#divA").hide(); $("#divB").show(); $("#divC").hide();  
$("#lnkA").hide(); $("#lnkB").show(); $("#lnkC").hide();

Первая вкладка (divGen) отображается всегда. Мне нужен способ перебрать список вкладок, чтобы определить, какие вкладки могут быть видны, так как я добавляю кнопку, чтобы перейти к следующей вкладке. Поскольку вкладки отображаются динамически, мне нужно определить, должна ли кнопка отображаться, и какую вкладку нужно «поворачивать» при нажатии. Я безуспешно пробовал следующее:

var $tabs = $('#Tabs').tabs();  
var i, count = 0;  
for (i = 0; i < $tabs.tabs('length'); i++) {  
    if ($tabs.tabs(i).is('visible')) {  
        count++;  
    }  
}  

if (count > 1)) {  
    Display the button.  
}

Чего мне не хватает? Я посмотрел на все примеры и не могу найти решение. У меня есть идея, что это из-за скрытия / показа и неправильного выполнения видимого теста.

Заранее спасибо

Answer 1

Демо

if ( $('#Tabs ul li:visible').length > 1) ) {  
    //Display the button.  
}

Обновление

Если вы скрываете тег привязки (как вам кажется), вам может понадобиться использовать

if ( $('#Tabs ul li a:visible').length > 1) ) {  
    //Display the button.  
}

Answer 2

Для кнопки показать / скрыть:

// if more than one tab is visible display the button  
if ($('#Tabs ul li a:visible').length > 1)) {  
       //Display the button.  
} else {  
       //Display the button.  
}

Функция, которую вызывает кнопка:

function fnNextTab(div) {  
    var $tabs = $(div).tabs();
    var selected = $tabs.tabs('option', 'selected');
    var max = $tabs.tabs('length') - 1; // Zero based

    $(div + ' ul li a').each(function(i) {
        // if the tab is visible and 'after' the current tab select it
        if (($(this).is(':visible')) && (i > selected)) {
            $tabs.tabs("select", i);    // This selects the tab
            $tabs.tabs('load', i);      // This displays the tab
            return false;               // Done searching
        }

        if (i >= max) {
            // Goto the General (first) tab
            $tabs.tabs("select", 0);    // This selects the tab
            $tabs.tabs('load', 0);      // This displays the tab
        }
    });
}

В вызове передается div, так что эта функция может использоваться разными страницами; каждая из которых имеет различную коллекцию вкладок, а также разные имена.