Ответ 1
Попробуйте оставить класс active
как с вкладкой <li>
, так и с контентом <div>
. Одна из первых строк кода в методе show()
заключается в коротком замыкании, если запрошенная вкладка уже активна.
На странице, где у меня есть n вкладок, и следующий script (coffeescript, я проверил скомпилированный javascript и, похоже, все в порядке)...
$ ->
init()
init = ->
$('a[data-toggle="tab"]').on 'shown', (event) ->
shown = event.target
console.log("Showing tab: " + shown)
Теперь "показанное" событие не срабатывает при загрузке страницы, поэтому для первой вкладки, отображаемой на странице, нет способа справиться с этим (например: загрузка содержимого через xhr)
Я попытался добавить это к вышеуказанному script, чтобы увидеть, может ли его запуск вручную:
$('a[data-toggle="tab"]:first').tab 'show'
... но это не так.
Это HTML-код, который я использую в своем представлении
<div class="tabbable">
<ul class="nav nav-tabs">
<li class="active">
<a href="#updates" data-toggle="tab"><%=t :updates, :scope => 'user.profile.sections'%></a>
</li>
<li class="">
<a href="#activity" data-toggle="tab"><%=t :activity, :scope => 'user.profile.sections'%></a>
</li>
<li class="">
<a href="#articles" data-toggle="tab"><%=t :articles, :scope => 'user.profile.sections'%></a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="updates">
</div>
<div class="tab-pane" id="activity">
</div>
<div class="tab-pane" id="articles">
</div>
</div>
</div>
Любая подсказка?
Попробуйте оставить класс active
как с вкладкой <li>
, так и с контентом <div>
. Одна из первых строк кода в методе show()
заключается в коротком замыкании, если запрошенная вкладка уже активна.
Вы можете инициировать событие вручную, когда вы указываете странице на вкладке:
$('a[data-toggle="tab"]:first').trigger("shown.bs.tab");
Я думаю, что вы смешиваете закладки Bootstrap Javascript Toggable и вкладки Basic, которыми управляют классы и id
Если вы хотите использовать Javascript для управления вкладками, вы должны удалить привязку данных-toggle = "tab" от якорей элементов LI, как показано здесь: http://getbootstrap.com/2.3.2/javascript.html#tabs
Вы можете сравнить синтаксис с вкладками basics: http://getbootstrap.com/2.3.2/components.html#navs