相关疑难解决方法(0)

Twitter Bootstrap选项卡:转到页面重新加载或超链接上的特定选项卡

我正在开发一个网页,其中我正在使用Twitter的Bootstrap Framework和他们的Bootstrap Tabs JS.除了一些小问题外,它的效果很好,其中一个是我不知道如何从外部链接直接转到特定的选项卡.例如:

<a href="facility.php#home">Home</a>
<a href="facility.php#notes">Notes</a>
Run Code Online (Sandbox Code Playgroud)

单击外部页面上的链接时,应分别转到"主页"选项卡和"注释"选项卡

html javascript tabs twitter-bootstrap

343
推荐指数
14
解决办法
27万
查看次数

如何在没有页面刷新的情况下使用JavaScript从window.location(URL)中删除哈希?

我有这样的URL:http://example.com#something如何删除#something,而不会导致页面刷新?

我尝试了以下解决方案:

window.location.hash = '';
Run Code Online (Sandbox Code Playgroud)

但是,这不会#从URL中删除哈希符号.

javascript window.location fragment-identifier

306
推荐指数
10
解决办法
26万
查看次数

Bootstrap 3:在页面刷新时保持选中的选项卡

我试图通过Bootstrap 3在刷新时保持选定的选项卡处于活动状态.尝试并检查了一些问题已经在这里被问过,但没有为我工作.不知道我哪里错了.这是我的代码

HTML

<!-- tabs link -->
<ul class="nav nav-tabs" id="rowTab">
    <li class="active"><a href="#personal-info" data-toggle="tab">Personal Information</a></li>
    <li><a href="#Employment-info" data-toggle="tab">Employment Information</a></li>
    <li><a href="#career-path" data-toggle="tab">Career Path</a></li>
    <li><a href="#warnings" data-toggle="tab">Warning</a></li>
</ul>
<!-- end: tabs link -->

<div class="tab-content">
    <div class="tab-pane active" id="personal-info">
        tab data here...
    </div>

    <div class="tab-pane" id="Employment-info">
        tab data here...
    </div>

    <div class="tab-pane" id="career-path">
        tab data here...
    </div>

    <div class="tab-pane" id="warnings">
        tab data here...
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

Javascript:

// tab
$('#rowTab a:first').tab('show');

//for bootstrap 3 use 'shown.bs.tab' …
Run Code Online (Sandbox Code Playgroud)

jquery tabs twitter-bootstrap twitter-bootstrap-3

114
推荐指数
9
解决办法
17万
查看次数

在URL链接的基础上激活Bootstrap选项卡

我有引导标签,我想在URL链接的基础上激活标签.

例如:

xyz.xxx/index#tab2应该在页面加载时激活tab2.

到目前为止,这是我的代码

<div class="tab-wrap">
  <div class="parrent pull-left">
    <ul class="nav nav-tabs nav-stacked">
      <li class="active"><a href="#tab1" data-toggle="tab" class="analistic-01">Tab 1</a></li>
      <li class=""><a href="#tab2" data-toggle="tab" class="analistic-02">Tab 2</a></li>
      <li class=""><a href="#tab3" data-toggle="tab" class="analistic-03">Tab 3</a></li>
    </ul>
  </div>
  <div class="tab-content">
    <div class="tab-pane active in" id="tab1">
      <p> hello 1</p>
    </div>

    <div class="tab-pane" id="tab2">
      <p> hello 2</p>
    </div>

    <div class="tab-pane" id="tab3">
      <p>Hello 3</p>
    </div>
  </div> <!--/.tab-content-->
</div><!--/.tab-wrap-->
Run Code Online (Sandbox Code Playgroud)

默认情况下它使tab1处于活动状态,因此在我的情况下可能会根据我的URL链接默认激活第二个选项卡.

假设我将#tab2放在URL中,那么它应该在页面加载时默认使tab2处于活动状态.

jquery tabs twitter-bootstrap

9
推荐指数
2
解决办法
2万
查看次数