不带包装器/容器div的jQuery选项卡

我需要将其添加到内容管理系统中，其中每个编辑器框都有一个字符。限制为4000。我无法将所有内容div放入其中，我需要将每个选项卡内容div放入单独的编辑器框中。这就是为什么我需要摆脱包装器div

我有以下带有包装器div“tabs”的tab脚本：

---

我的想法是在我的每个内容中添加一个公共类“series1”，以便归档相同的效果，但不起作用：（我是jquerynoob）

如果我必须在jQuery中手动提及单个id/类名，那么有人可以帮助我完成这项工作吗

---

非常感谢

这种类型的功能在jQuery中很容易实现，无需

.tabs（）

，请看一些想法。

这种类型的功能在jQuery中很容易实现，无需

.tabs（）

，查看一些想法。

在

ul

周围有一个

div

有什么问题？我将这些代码添加到内容管理系统中，每个编辑器框都有一个字符。限制为4000。我不能把所有的内容都放进去。这就是为什么我需要将每个选项卡内容div放在一个单独的编辑器框中。在

ul

周围有一个

div

有什么问题？我将这些代码添加到内容管理系统中，每个编辑器框都有一个字符。限制为4000。我不能把所有的内容都放进去。这就是为什么我需要将每个选项卡内容div放在一个单独的编辑器框中。谢谢Tom！如果我在一个页面中有两组或多组选项卡，您将如何修改它？再次感谢您抽出时间！非常确定有一种更简单的方法，但在中我使用了

.filter（）

，它在我要从中删除

.show

的正确元素上返回true。谢谢Tom！如果我在一个页面中有两组或多组选项卡，您将如何修改它？再次感谢您抽出时间！非常确定有一种更简单的方法，但在中我使用了

.filter（）

，它在我要从中删除

.show

的正确元素上返回true。

<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>

$(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();
});

  <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();
});