Backbone.js router.route()

The Backbone.js Route method is used to manually create a route for the router. It may be a routing string or regular expression. It appends the router parameter using slash followed by colons and parameter's name.

Syntax:

Parameter explanation:

route: It specifies a routing string or regular expression.

name: It specifies the name of the router parameter.

callback: It specifies the name of the router, if callback argument is omitted.

Let's take an example.

See this example:

<!DOCTYPE html>
   <head>
      <title>Router Route Example</title>
         <script src="https://code.jquery.com/jquery-2.1.3.min.js" type="text/javascript"></script>
         <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js" type="text/javascript"></script>
         <script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js" type="text/javascript"></script>
   </head>
      <script type="text/javascript">
         var RouteMenu = Backbone.View.extend({
            el: '#routemenu',   
            events: {
               'click a' : 'onClick'
            },

            onClick: function( e ) {
               router.navigate('/');
            }
        });

        var Router = Backbone.Router.extend({

           routes: {
              'route/:id' : 'defaultRoute'
           },
        });
       var routemenu = new RouteMenu();

        Backbone.history.start();
     </script>
  <body>
     <section id="routemenu">
        <ul>
           <li> <a href="#/route/1">route 1 </a> </li>
           <li> <a href="#/route/2">route 2 </a> </li>
           <li> <a href="#/route/3">route 3 </a> </li>
       </ul>
    </section>
  </body>
</html>

Test it Now

Output:

Save the above code in route.html file and open this file in a new browser.