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

我正在开发一个非常大的页面，里面有很多内容和一些重叠以及各种复杂的东西。我将为您保留所有代码，只包括相关部分

基本上，我有一些侧边栏按钮，可以根据单击的按钮打开覆盖。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，正如我所说的，我只包含了相关的部分。可能没有必要使用“toString”，回顾过去，我不完全确定是否有它，但我非常怀疑这是问题所在。）

在添加jQuery选项卡插件之前，这段代码运行良好

现在，在其中一个覆盖层中，我需要一些“选项卡式”内容——因此我下载了三个单独的jQuery选项卡插件，它们都产生了相同的错误。在这个特殊的例子中，我使用的是。首先，以下是选项卡区域的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>

出于某种原因，我使用的每个jQuery选项卡插件都会产生相同的错误（我还使用了jQuery的UI核心插件，以及）。当我尝试使用侧边栏按钮打开任何覆盖时，该覆盖不会出现，并且出现以下控制台错误：

Uncaught TypeError: Cannot read property 'toString' of undefined

也许这个错误最奇怪的因素是它只出现一次。在第一个错误之后，任何后续的单击都会正常运行

我只是不明白这些插件是如何导致这个错误出现的。jQuery以前能够读取自定义数据字段，为什么突然不能呢？如果我不调用插件，它会再次工作

---

我意识到这是一个很长很复杂的问题，但是如果有人知道这个问题是什么以及如何解决它，我将非常感激

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

发生错误时，

this

的值是多少？

console.log（this）

返回div元素的值，正如我所期望的那样

..

也值得注意（我将编辑我的原始帖子以反映这一点）：它在我第二次单击时起作用。但每次加载页面时，第一次单击都会返回错误。您可以制作一个JSFIDLE来演示问题，或者链接到实际站点吗？不幸的是，没有。该项目实际上受到NDA的保护，我无法完整发布页面。这些小代码是可以接受的，但仅此而已。您需要发布足够的内容，以便我们能够看到错误。实际上，没有任何东西表明选项卡和单击处理程序之间的任何关系。他们甚至不使用相同的选择器。

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

Uncaught TypeError: Cannot read property 'toString' of undefined