Javascript 引导远程选项卡-加载第一个选项卡

我使用库远程加载数据，因为我必须在每个选项卡上加载大量数据

我的问题是，每当我的页面被加载时，页面加载时第一个标签就不会被加载；我需要单击另一个选项卡，然后返回到第一个选项卡，以便加载第一个选项卡

上述库包含“loadFirstTab:”变量的功能，该变量可以设置为true或false，但无论该变量是true还是false，它都不会加载第一个选项卡

几个小时以来，我一直在尝试使用JS类和我的HTML，但无法正常工作并加载我的第一个选项卡

这是我的HTML的外观：

<li class="active"><a data-toggle="tab" href="#tab1" data-tab-url="tab1.php">Tab 1 - Never loaded on page load!</a></li>
  <li><a data-toggle="tab" href="#tab2" data-tab-url="tab2.php">">Tab2</a></li>
  <li><a data-toggle="tab" href="#tab3">Tab 3</a></li>
  <li><a data-toggle="tab" href="#tab4">Tab 4</a></li>

<div class="tab-content well">
  <div id="tab1" class="tab-pane fade in active" style="min-height:300px">
<h3>Loading data, please wait..</h3>
  </div>

  <div id="tab2" class="tab-pane fade in" style="min-height:300px">
<h3>Loading data, please wait..</h3>
  </div>

<div id="tab3 class="tab-pane fade in" style="min-height:300px">
    <h3>Data for tab 3</h3>
      </div>

<div id="tab4" class="tab-pane fade in" style="min-height:300px">
    <h3>Data for tab 4</h3>
      </div>

---

你也在另一个js中初始化了吗

---

确保将脚本加载到文档的页脚中，或在文档准备就绪后初始化它。

这对我来说很有效，请将以下脚本添加到html文件中

<script>
    $(document).ready(function(){
        $("#tab1").load("tab1.php");
    });
</script>

$（文档）.ready（函数（）{
$（“#tab1”）.load（“tab1.php”）；
});

我为此做了一个变通，我替换了这个：

if (!customSettings.loadFirstTab && !hasTab) {
    firstTab.click();
}

为此：

if (customSettings.loadFirstTab && hasTab) {
    $(firstTab.attr('href')).load(firstTab.attr('data-tab-url'));
}

在：

bootstrap remote tabs.js

它似乎在做这项工作并加载第一个选项卡，但仍然感觉不对劲，因为它没有考虑插件正在做的其他事情，例如加载屏蔽

if (customSettings.loadFirstTab && hasTab) {
    $(firstTab.attr('href')).load(firstTab.attr('data-tab-url'));
}