【问题标题】:Link to specific tab Bootstrap Codeigniter链接到特定选项卡 Bootstrap Codeigniter
【发布时间】:2015-07-12 14:24:12
【问题描述】:

我正在使用 codeigniter,但我遇到了同样的问题:

Link to specific tab Bootstrap

我正在尝试如下但没有成功:

<ul class="nav nav-pills nav-stacked">
    <li class="<?php echo ($acao == 'listar') ? 'active' : ''; ?>">
        <a href="#mytab1" data-toggle="tab">
            <i class="fa fa-cogs"></i>&nbsp;Name Link My tab 1
        </a>
    </li>
    <li class="<?php echo ($acao == 'cadastro') ? 'active' : ''; ?>">
        <a href="#mytab2" data-toggle="tab">
            <i class="fa fa-folder-open"></i>&nbsp;Name Link My tab 2
        </a>
    </li>
    <li class="<?php echo ($acao == 'tipos') ? 'active' : ''; ?>">
        <a href="#mytab2" data-toggle="tab">
            <i class="fa fa-cogs"></i>&nbsp;Name Link My tab 3
        </a>
    </li>
</ul> 

在页脚中:

    <script type="text/javascript">
        $(function() {
          // Javascript to enable link to tab
          var hash = document.location.hash;
          if (hash) {
            console.log(hash);
            $('.nav-stacked a[href='+hash+']').tab('show');
          }

          // Change hash for page-reload
          $('a[data-toggle="tab"]').on('show.bs.tab', function (e) {
            window.location.hash = e.target.hash;
          });
        });
    </script>
<script src="http://code.jquery.com/jquery.min.js"></script>
<script src="<?php echo site_url('assets/js/jquery-1.10.2.min.js'); ?>"></script>
<script src="<?php echo site_url('assets/js/jquery-migrate-1.2.1.min.js'); ?>"></script>
<script src="<?php echo site_url('assets/js/jquery-ui.js'); ?>"></script>

我也尝试将类更改为:

 $('.nav-pills a[href='+hash+']').tab('show');

并放入头部javascript,但它不起作用,我错在哪里?

【问题讨论】:

    标签: twitter-bootstrap codeigniter hash tabs


    【解决方案1】:

    而不是 $('.nav-stacked a[href='+hash+']').tab('show');

    试试

    $('.nav-stacked a[href='+hash+']').show();

    【讨论】:

      猜你喜欢
      • 2014-12-08
      • 2017-08-21
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-06-18
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多