两个（单独的）jQuery 选项卡插件杀死了我的代码

Question

我正在开发一个非常大的页面，其中有很多内容和一些叠加层以及各种复杂的东西。我将为您省去所有代码，只包含相关部分。

基本上，我有一些侧边栏按钮可以根据单击的按钮打开覆盖。 HTML 如下：

<div class="sideBtn sidebarOverlay" data-linkto="overlayMyInvoices">
    <img src="icons/icon_invoice.svg" alt=""><h2>Invoices</h2>
</div>

<div id="overlayMyInvoices" class="overlay">
</div>

这里是一些 Javascript:

$(sideBtns).click(function(index){

    var newId = "#" + (($(this).data("linkto")).toString());
    var newOverlay = $(newId);

});

（我已经遗漏了很多 Javascript，正如我所说的，我只包括了相关的位。'toString' 可能不是必需的，我不完全确定回想起来我把它放在那里了，但我非常怀疑这就是问题所在。）

在添加 jQuery 选项卡插件之前，这段代码工作正常。

现在，在其中一个叠加层中，我需要一些 'tabbed' 内容 - 所以我下载了三个单独的 jQuery 选项卡插件，所有三个都产生了相同的错误。在这种特殊情况下，我使用的是 Tabslet。首先，这是选项卡区域的HTML：

<div id="overlayMyInvoices" class="overlay">
    <div class='tabs'>
        <ul class='horizontal'>
            <li><a href="#tab-1">Tab 1</a></li>
            <li><a href="#tab-2">Tab 2</a></li>
            <li><a href="#tab-3">Tab 3</a></li>
        </ul>
        <div id='tab-1'></div>
        <div id='tab-2'></div>
        <div id='tab-3'></div>
    </div><!-- tabs -->
</div>

这里是 Javascript:

$('.tabs').tabslet();

出于某种原因，我使用的每个 jQuery 选项卡插件都会产生相同的相同错误（我还使用了 jQuery 的 UI 核心插件，并且 EasyTabs).当我尝试使用侧边栏按钮打开任何叠加层时，叠加层不会出现，并且出现此控制台错误：

Uncaught TypeError: Cannot read property 'toString' of undefined

这个错误最奇怪的地方可能是它只出现一次。第一次错误后的任何后续点击都正常运行。

我只是不明白这些插件是如何导致出现此错误的。 jQuery 之前可以读取自定义数据字段，怎么突然不能了？如果我不调用插件，它会再次运行。

我知道这是一个很长很复杂的问题，但是如果有人知道这个问题是什么以及如何解决它，我将不胜感激！

Answer 1

对于仍然关心的人，我发现了这个问题。我写了一些非常愚蠢的 Javascript 来寻找 class 'active'。任何具有非特定 class 'active' 的元素。关于 'active' 的事情？这是很多开发人员使用的好词。我的代码和插件都使用 'active'，而我的 Javascript，因为它只是在页面上的任何地方寻找 'active'，所以正在运行。所以我自己的错！好

两个（单独的）jQuery 选项卡插件杀死了我的代码

Two (Separate) jQuery Tab Plugins Kill my Code

html

javascript

jquery

jquery-plugins