如何手动激活 Twitter Bootstrap 选项卡答案

【问题标题】：How to activate Twitter Bootstrap Tabs manually如何手动激活 Twitter Bootstrap 选项卡
【发布时间】：2012-06-22 05:12:42
【问题描述】：

使用 Twitter Bootstrap 的 [Tabbable Tabs][1]，它表示：

“通过 javascript 启用可选项卡（每个选项卡需要单独激活）”：

  $('#myTab a').click(function (e) {
    e.preventDefault();
  $(this).tab('show');
   })

然后您可以“以多种方式激活单个选项卡”：

$('#myTab a[href="#profile"]').tab('show'); // Select tab by name
$('#myTab a:first').tab('show'); // Select first tab
$('#myTab a:last').tab('show'); // Select last tab
$('#myTab li:eq(2) a').tab('show'); // Select third tab (0-indexed)

当我单击每个选项卡并使其#id 出现在 URL 中时，如何单独激活它？

【问题讨论】：

问题不清楚。要手动激活标签 - 只需点击它
我想知道在单击选项卡后，使用什么代码在 DIV 部分和 url 中显示每个选项卡 #ID 内容

标签： jquery twitter-bootstrap

【解决方案1】：

这是在url中添加哈希，你可以添加这个：

$('a').click(function(e){

e.preventDefault();
if(window.location.hash) window.location.hash = '';
window.location.hash = $(e.target).attr('class'); //or id, or other attribute

});

当用户单击“a”标签（或您的标签 ID 等）时，删除以前的哈希并附加新的哈希。基本上使用window.location.hash。

【讨论】：

谢谢亚历克斯...你可以聊天吗？我真的很困惑我试图完成这个的全部原因。

【解决方案2】：

在位置 url 中正确显示哈希的方法是删除 e.preventDefault(); 行。我假设您的 A 标签指向 #hash_tags，如下所示：<a href="#mytasks">My Tasks</a>。这是我如何使用 jQuery 激活引导选项卡的示例：

$('#tabs li a').each(function () {
  $(this).click(function (e) {
    $(this).tab("show");
  });
});

【讨论】：