zoukankan      html  css  js  c++  java
  • Backbone.Router.extend 路由

    例子一:

     1 <!DOCTYPE HTML>
     2 <html lang="en-US">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>backbone</title>
     6     <script src="app/jquery-1.8.1.min.js"></script>
     7     <script src="app/underscore-min.js"></script>
     8     <script src="app/backbone-min.js"></script>
     9     <script>
    10     (function($){
    11         var AppRouter = Backbone.Router.extend({
    12             routes:{
    13                 "*actions":"defaultRoute"
    14             },
    15             defaultRoute:function(actions){
    16                 console.log(actions);
    17             }
    18         });
    19 
    20         var app_router = new AppRouter;
    21         Backbone.history.start();
    22     })(jQuery);
    23     </script>
    24 </head>
    25 <body>
    26     <a href="#actions">actions</a>
    27 </body>
    28 </html>

    例子二:

     1 <!DOCTYPE HTML>
     2 <html lang="en-US">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>backbone</title>
     6     <script src="app/jquery-1.8.1.min.js"></script>
     7     <script src="app/underscore-min.js"></script>
     8     <script src="app/backbone-min.js"></script>
     9     <script>
    10     (function($) {
    11         var AppRouter = Backbone.Router.extend({
    12             routes: {
    13                 "/posts/:id": "getPost",
    14                 "*actions": "defaultRoute"
    15             },
    16 
    17             //匹配/posts/:id
    18             getPost: function(id) {
    19                 console.log(id);
    20             },
    21 
    22             //匹配所有url
    23             defaultRoute: function(actions) {
    24                 if (actions) {
    25                     console.log(actions);
    26                 }
    27             }
    28         });
    29 
    30         var app_router = new AppRouter;
    31         Backbone.history.start();
    32     })(jQuery);
    33     </script>
    34 </head>
    35 <body>
    36     <p><a href="#actions">testActions</a></p>
    37     <p><a href="#/posts/120">Post 120</a></p>
    38 </body>
    39 </html>

    例子二显示了两种路由取值的方法

  • 相关阅读:
    C语言寒假大作战01
    C语言I作业12—学期总结
    C语言I博客作业11
    C语言I博客作业10
    浅谈js模块加载方式(初级)
    浅谈.net的后台校验
    api接口访问限制
    系统操作日志表单形式构建
    RedisUtil(未完,持续更新中....)
    定时处理组件---Quartz.net
  • 原文地址:https://www.cnblogs.com/qzsonline/p/2684627.html
Copyright © 2011-2022 走看看