JQuery Tabs - Выберите вкладку на основе текста вкладки

Question

Можно ли сделать выбор вкладки на основе заголовка вкладки? В настоящее время у меня есть настройка, в которой есть ссылки, указывающие на целочисленное значение вкладки, но хотелось бы иметь возможность выбирать вкладку только по значению String.

Функция изменения тока

<a href="javascript:changeTab(3)">Application</a>
function changeTab(tabID) {
    $('#tabs').tabs('select', tabID);
}

Что бы я «хотел», чтобы иметь возможность сделать

<a href="javascript:changeTab('Driver Application')">Application</a>
function changeTab(tabID) {
    $('#tabs').tabs('select', tabID);
}

Я нашел пример для SO, который получает VALUE текста для вкладки, но ничего, где он использует известное значение для определения выбранной вкладки.

Answer 1

Метод 'select' также может использовать селектор, поэтому, если вы можете использовать идентификатор вкладки, ваш код может выглядеть следующим образом:

<a href="javascript:changeTab('#driverapplication')">Application</a>
function changeTab(tabID) {
    $('#tabs').tabs('select', tabID);
}

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

function changeTab(tabText) {
    var href = $('#tabs li a:contains("' + tabText + '")').attr("href");
    tabs('select', href);
}

Настроить по вкусу, очевидно.

Answer 2

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

<a href="javascript:changeTab('Driver Application')">Application</a>
function changeTab(tabContents) {
    $('#tabs').tabs('select', $(".ui-tabs-nav a:contains(tabContents)").attr("href"));
}

Answer 3

function changeTab(sTabContent) {
    var iId = $(".ui-tabs-nav li a:contains('" + sTabContent + "')")
        .parent().index();
    $('#tabs').tabs('select', iId);
}

Также смотрите мой jsfiddle .