1

我的页面上有引导导航药丸。

这是代码的一部分： 

  <ul class="nav nav-pills offset3">
    <li class="active">
      <a href="#alphabetical" class="alphabetical_tab" data-toggle="pill"> 
        Поиск по алфавиту 
      </a>
    </li>
    <li>
      <a href="#name_search" class="name_search_tab" data-toggle="pill"> 
        Поиск по имени 
      </a>
    </li>
    <li>
      <a href="#new_characteristic" data-toggle="pill" class="new_category_characteristic">           
        Создать характеристику 
      </a>
    </li>
  </ul>
  <div class="tab-content">
    <div id="alphabetical" class="tab-pane active">
      content 1
    </div>
    <div id="name_search" class="tab-pane">
      content 2
    </div>
    <div id="new_characteristic" class="tab-pane">
      content 3
    </div>

现在我想在有人单击选项卡时更改 url 哈希。bootstrap 是否有一些功能或插件，或者我需要手动编写这个功能？

例如，如果我手动进行 - 像这样： 

$(function(){
  var hash = window.location.hash;
  hash && $('ul.nav a[href="' + hash + '"]').tab('show');

  $('.nav-tabs a').click(function (e) {
    $(this).tab('show');
  });
});

如何正确使用 backdone.marionette（在视图、路由器或其他部分代码中）？

4

1 回答 1

2

对于backbone/backbone.marionette 实现：它结合了在路由器文件中配置路由并从您的视图中触发该路由，当然您必须为要检索的所需状态提供参数。

在我的实现（木偶）中，我从我的控制器触发它，所以：

路由器.js：

   define([
   "marionette",
   "controller"
],
function (Marionette, appController){
    "use strict";

    var AppRouter = Backbone.Marionette.AppRouter.extend({

        appRoutes  : {
           "mainview/id/:tabName": "showTabFunction"
    });

   return new AppRouter({controller:appController});

});

控制器.js：

    define([
    'marionette',
    'myapp',
    'vent',
    'userSession', ],

function(Marionette, App, vent, userSession) {

    var MyController = Marionette.Controller.extend({

        showTabFunction: function(tabName) {
            this.isAuthenticated();

            require(['path/to/my/files'], function(page) {
                var page= new page({
                    tab:tabName
                });
                App.main.currentView.content.show(page);
            });
        }

    })

    return new MyController();

});

最后你 view.js：

manageTab: function(e) {

         this.curTab = $(e.target).attr("data-id");

         //update URL 
        App.Router.navigate("mainview/id/"+this.curTab, {
            trigger: false
        });
    },

希望有帮助

于 2013-05-07T22:30:55.070 回答