如何使用 Javascript 将用户带到特定选项卡？答案

【问题标题】：How to take user to specific tabs using Javascript?如何使用 Javascript 将用户带到特定选项卡？
【发布时间】：2016-09-09 07:38:39
【问题描述】：

当用户使用 Javascript 单击特定选项卡时，如何将用户从 html 页面带到特定的 html 选项卡页面？

我想创建一些东西，比如将一个特定选项卡从一个 html 页面链接到另一个 html 页面，这样当用户点击该链接时，它会将他们带到特定的选项卡。

两个html都是分开的.html文件

这是我的Home.html页面代码

<style>
body {
  margin-top: 50px;
}

.box {
  border: 3px solid blue;
  height: 250px;
  width: 250px;
  margin: 20px 0;
}

.btn-success {
  margin: 200px 55px;
}

</style>

  </head>
  <body>

<div class="container">
  <div class="row">
    <div class="col-md-4">
      <div class="box">
        <a href="" class="btn btn-success">LEARN MORE 1</a>
      </div>
</div>
<div class="col-md-4">
  <div class="box">
    <a href="" class="btn btn-success">LEARN MORE 2</a>
  </div>
</div>
<div class="col-md-4">
  <div class="box">
    <a href="" class="btn btn-success">LEARN MORE 3</a>
  </div>
</div>
<div class="col-md-4">
  <div class="box">
    <a href="" class="btn btn-success">LEARN MORE 4</a>
  </div>
</div>
<div class="col-md-4">
  <div class="box">
    <a href="" class="btn btn-success">LEARN MORE 5</a>
  </div>
</div>
<div class="col-md-4">
  <div class="box">
    <a href="" class="btn btn-success">LEARN MORE 6</a>
  </div>
</div>
</div>
    </div>

这是我的Service.html标签页代码

<div class="tab-content">
        <div id="LEARN-MORE-1" class="tab-pane fade in active">
          <h3>LEARN MORE 1</h3>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        </div>
        <div id="LEARN-MORE-2" class="tab-pane fade">
          <h3>LEARN MORE 2</h3>
          <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
        </div>
        <div id="LEARN-MORE-3" class="tab-pane fade">
          <h3>LEARN MORE 3</h3>
          <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam.</p>
        </div>
        <div id="LEARN-MORE-4" class="tab-pane fade">
          <h3>LEARN MORE 4</h3>
          <p>Eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.</p>
        </div>
      </div>
    </div>

我没有 Javascript 知识，很抱歉没有在这里提供我的 Javascript 代码。我不知道如何创建 javascript 文件。

点击了解更多按钮时如何链接html页面并将用户带到特定标签？

类似这样的：

非常感谢您的帮助！

【问题讨论】：

标签： javascript html css twitter-bootstrap tabs

【解决方案1】：

在href中添加如下链接

 <a href="page_link#desired_tab_id">

【讨论】：

【解决方案2】：

如果您没有 javascript 知识，最好使用 bootstarp tab 概念。 http://getbootstrap.com/javascript/#tabs

它将处理所有选项卡的切换。

【讨论】：