jQuery嵌套选项卡没有UI
问题描述:
试图设置嵌套选项卡没有 jQuery UI。jQuery嵌套选项卡没有UI
我有*标签工作正常,但是,不是内部标签 - 索引似乎越来越混淆*和内部标签。
$(function() {
$('#application-tabs nav a').on('click', function() {
show_content($(this).index());
});
show_content(0);
function show_content(index) {
// Make the content visible
$('#application-tabs .content.visible').removeClass('visible');
$('#application-tabs .content:nth-of-type(' + (index + 1) + ')').addClass('visible');
// Set the tab to selected
$('#application-tabs nav a.selected').removeClass('selected');
$('#application-tabs nav a:nth-of-type(' + (index + 1) + ')').addClass('selected');
}
});
$(function() {
$('.application-sub-tabs nav.sub a').on('click', function() {
show_content_sub($(this).index());
});
show_content_sub(0);
function show_content_sub(index) {
// Make the content visible
$('.application-sub-tabs .content-sub.visible-sub').removeClass('visible-sub');
$('.application-sub-tabs .content-sub:nth-of-type(' + (index + 1) + ')').addClass('visible-sub');
// Set the tab to selected
$('.application-sub-tabs nav.sub a.selected-sub').removeClass('selected-sub');
$('.application-sub-tabs nav.sub a:nth-of-type(' + (index + 1) + ')').addClass('selected-sub');
}
});
下面是我在这其中的jsfiddle:https://jsfiddle.net/81ebq0Lw/5/
上获得内部标签顶部的标签的独立运作有什么想法?
我敢肯定有设置此功能的更有效的方法...
感谢您的帮助。
答
有两个导航标签。你需要特定于选择器。 检查这个小提琴。
<nav id="test"> and
$('#application-tabs #test a').on('click', function()
谢谢你 - 这是非常合情合理的,为什么这是越来越糊涂。我会如何设置第一个子选项卡处于活动状态,每次选择*别的选项卡? – d38
例如 - 选项卡2下的子选项卡较少,选择选项卡1或选项卡3中的子选项卡3,然后返回选项卡2 - 任何子选项卡都不处于活动状态。 https://jsfiddle.net/e8eLmdj0/1/ – d38
谢谢@techLove - 非常感谢您的帮助! – d38