Question

当用户使用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页面并将用户带到特定标签页？

这样的事情：

this

非常感谢您的帮助！

Answer 1

在href中添加链接，如下所示

 <a href="page_link#desired_tab_id">

Answer 2

如果您不具备javascript知识，那么最好使用bootstarp标签概念。 http://getbootstrap.com/javascript/#tabs

它将处理所有标签的切换。

如何使用Javascript将用户带到特定标签？

2 个答案: