4

我正在使用 Twitter 引导程序的选项卡插件,它需要激活选项卡的链接以包含以 a 开头的 URL 片段,#后跟id包含选项卡 HTML 内容的 div。

 <a href="#home" data-toggle="tab">Home</a>
 <div class="tab-pane" id="home">...</div>

有什么办法可以摆脱不得不使用的#?另外,我尝试删除#in 链接并以某种方式单击该链接不会使浏览器跟随该链接!

我正在使用backbone.js 和pushstates,所以我希望链接不包含#,并且单击它应该将网址更新为mydomain.com/home而不是mydomain.com/#home

 <a href="home" data-toggle="tab">Home</a>
 <div class="tab-pane" id="home">...</div>

和...

$(function() {
    $('a[data-toggle="tab"]').on('shown', function(e) {
        // Update URL in address bar to trigger Backbone.js's router
        window.location.hash = e.target.hash;
    });
});

这可以做到吗?还是我最好使用backbone.js 来编写我自己的选项卡功能?

4

2 回答 2

3

只需在

并执行以下操作:

events:
  'show .nav-tabs a': 'navigateTab'

navigateTab: (e) ->
  target = $(e.currentTarget)
  @router.navigate(target.data('url'), trigger: false)
于 2012-09-04T14:20:12.810 回答
1

我可以看到有不同类型的选项卡,如果您遵循基本选项卡示例而不是Tabbable 示例,这不起作用吗?

http://twitter.github.com/bootstrap/components.html#navs

我认为这里的主要问题是Tabbable 示例使用了一个 jQuery 插件,它可能与backbone.js 绑定冲突。

于 2012-07-31T12:38:04.763 回答