主干.js 中的多个主题标签路由

Question

我有一个需要大量用户输入的项目。它基本上是一个由六块组成的谜题，这些块由标签路线触发。很容易，对吧？我猜。

我现在有一个很好的设置，当达到一个哈希值时（“www.website.com/index.html/#test”），第一块就会出现。现在，这很好，但问题是，这些片段可以在任何时间以任何顺序触发。因此，如果我有以下路线 - “1”、“2”、“3”等，它需要能够类似于：(“www.website.com/index.html/#3/#1/ #2") 或类似的东西。在我首先弄清楚如何让它发挥作用之后，我可以担心以后让它看起来不错。

这是我目前拥有的路线代码 -

<script>
    $(function(){

    var hideOne = function () {
        //alert("hideOne");
        var elem = document.getElementById("one");
        elem.className = "hide";
    };

    var Workspace = Backbone.Router.extend({
      routes: {
        "test":"test",// #test
      },    
      test: hideOne
    });

    var router = new Workspace();
    Backbone.history.start(); 

});
</script> 

所以我的问题是；我该如何做才能在backbone.js中拥有多个主题标签路由？

提前致谢。

-米切尔

Answer 1

你可以做这样的事情。您在哪里浏览到 stuff.com/path#hide/one/three 这里带有 (/:x) 的路由是动态匹配器。所以 () 表示它是可选的， :x 表示它将把来自 url 片段的那部分的字符串值作为参数传递给路由匹配时调用的函数。因此，如果您的图像数量限制在非常小的范围内，我认为这应该没问题。

<script>
  $(function(){
    var hideMany = function () {
      var toHide = [].slice.call(arguments);
      toHide.forEach(function (id) {
        if(id === null) { return }
        var elem = document.getElementById(id);
        if(elem) {
          elem.className = "hide";
        }
      });
    };

    var Workspace = Backbone.Router.extend({
      routes: {
        "hide(/:a)(/:b)(/:c)" : "test"
      },
      test: hideMany
    });

    var router = new Workspace();
    Backbone.history.start();

  });
</script>