使用jQuery从一个DIV中获取一个类，并使用第一个类将另一个类添加到所有DIV中

基本上，我正在创建一个选项卡式面板。当用户单击某个选项卡时，我希望面板关闭。该选项卡的类与相应面板上的类相同。我想使用jQuery get（$this）类，并在单击带有XX类的选项卡时，向带有XX类的所有div添加class.active

这是我的HTML：

<div class="bundle_panel">
    <div class="tab tXX">TITLE_HERE</div>
    <div class="panel tXX">CONTENT_HERE</div>
</div>

---

任何帮助都将不胜感激。如果我需要澄清任何事情或提供更多信息，请告诉我。

实现选项卡的更好方法是为每个“面板”使用

id

属性，并从选项卡链接到那些

id

：

<ul>
    <li><a href="#panel-1">Panel 1</a></li>
    <li><a href="#panel-2">Panel 2</a></li>
</ul>

<section id="panel-1">
    <h2>Panel 1</h2>
    <p>Content</p>
</section>

<section id="panel-2">
    <h2>Panel 2</h2>
    <p>Content</p>
</section>

编辑：附加的好处是，没有JavaScript它也有意义

Edit2：在代码中，问题是您试图只选择类名，而不在其前面加点（.），它应该是：

$('.' + panelClass).addClass('active');

---

示例中的问题是，单击将导致将“tab tx”的值分配给panelClass变量。然后您的行

$（panelClass）.addClass（'active'）正在尝试将活动类添加到未退出的元素中。如果您使用：

$(".bundle_panel .tab").click(function(){
    var panelClass = $(this).attr("class").split(' ');
    $(".panel."+panelClass[1]).addClass('active');
});​

这会将活动类应用于所有单击了“panel”类和该元素的第二个类的元素（使用示例代码TXX）
您面临什么问题。您可以在JSFIDLE中创建一个示例吗？您的选项卡标题div是否总是只有两个类（例如“tab tXX”），或者示例中的格式是否会更改？在JQUERY添加“.active”类之前，它们将只有这两个类这太棒了！谢谢然而，当我把它放在代码中时，什么也没有发生。我被难住了。它看起来和JS小提琴一模一样（我甚至尝试了一些简单的方法，只是尝试在单击时将类添加到选项卡。这是链接。有什么建议吗？它与任何代码都没有冲突，我使用的是1.7.2库。我使用PHP引入类名。可能是这样吗？试着将代码放在jQuery块的顶部，在document.ready之后。我复制了您的代码a。）nd在本地运行了它，这似乎解决了它没有运行的问题（它不在正确的位置）。现在，虽然你可能想从所有其他选项卡中删除活动类。这很有效。我之前尝试过，但没有，但这次我清除了缓存，它执行得很好。谢谢！：）是的，我知道在这一步之后，我必须清除活动选项卡，但现在这不是问题。再次感谢你的帮助。
$('.' + panelClass).addClass('active');

$(".bundle_panel .tab").click(function(){
    var panelClass = $(this).attr("class").split(' ');
    $(".panel."+panelClass[1]).addClass('active');
});​