使Twitter Bootstrap选项卡持久化的最佳方法 [英] Best way to make twitter bootstrap tabs persistent

问题描述

使这些标签保持不变的最佳方法是什么？

What is the best way of making these tabs persist?

http://twitter.github.com/bootstrap/javascript.html#tabs

要添加一些上下文，这是针对Rails应用程序的。我正在将数组[tab1，tab2]传递到视图，同时渲染两个选项卡并使用bootstrap选项卡插件来切换其可见性。

To add some context, this is for a rails application. I'm passing an array [tab1, tab2] to my view, rendering both tabs and using the bootstrap tab plugin to toggle their visibility.

推荐答案

此代码根据#hash选择正确的标签，并在单击标签时添加正确的#hash。 （这使用jquery）

This code selects the right tab depending on the #hash and adds the right #hash when a tab is clicked. (this uses jquery)

在Coffeescript中：

In Coffeescript :

$(document).ready ->
    if location.hash != ''
        $('a[href="'+location.hash+'"]').tab('show')

    $('a[data-toggle="tab"]').on 'shown', (e) ->
        location.hash = $(e.target).attr('href').substr(1)

或在JS中：

$(document).ready(function() {
    if (location.hash !== '') $('a[href="' + location.hash + '"]').tab('show');
    return $('a[data-toggle="tab"]').on('shown', function(e) {
      return location.hash = $(e.target).attr('href').substr(1);
    });
});

这篇关于使Twitter Bootstrap选项卡持久化的最佳方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！