没有包装器/容器div的jQuery选项卡

Question

我需要在内容管理系统中添加它，其中每个编辑框都有一个字符。限制为4000.我无法适应我所有的内容div，我需要将每个标签内容div放在一个单独的编辑框中。这就是为什么我需要摆脱包装div。

我有包装格 “选项卡” 包含以下选项卡的脚本：

<div class="tabs"> 
    <ul class="nav"> 
    <li><a href="#t1">one</a></li> 
    <li><a href="#t2">two</a></li> 
    <li><a href="#t3">three</a></li> 
    </ul> 

    <div id="t1">a lot of content</div> 
    <div id="t2">a lot of content</div> 
    <div id="t3">a lot of content</div> 
</div> 

jQuery代码：

$(function() { 
    var tabContainers = $('div.tabs > div'); 

    $('div.tabs ul.nav a').click(function() { 
    tabContainers.hide().filter(this.hash).show(); 

    $('div.tabs ul.nav a').removeClass('selected'); 
    $(this).addClass('selected'); 

    return false; 
    }).filter(':first').click(); 
}); 

---

我的想法是一个通用类 “系列1” 添加到每个我的内容为了存档相同的效果，但不起作用:(是jquery noob）

<ul class="nav"> 
    <li><a href="#t1">one</a></li> 
    <li><a href="#t2">two</a></li> 
    <li><a href="#t3">three</a></li> 
    </ul> 

    <div id="t1" class="series1">content</div> 
    <div id="t2" class="series1">content</div> 
    <div id="t3" class="series1">content</div> 

---

$(function() { 
    var tabContainers = $('div.series1'); 

    $('ul.nav a').click(function() { 
    tabContainers.hide().filter(this.hash).show(); 

    $('ul.nav a').removeClass('selected'); 
    $(this).addClass('selected'); 

    return false; 
    }).filter(':first').click(); 
}); 

如果我在jQuery的手动提单个ID /类名没关系，有人可以帮助我，使这项工作？

非常感谢！

Answer 1

这种类型的功能很容易实现在jQuery没有.tabs()，看看this fiddle的一些想法。