シングルページアプリには欠かせないJavaScriptのライブラリ

1
2
3
4
5
6
7

<a href="#/hello">ハローワールド</a>
<script src="router.js"></script>
<script>
var router = new Router;
router.add('#/hello', hello);
function hello(){alert('Hello, World!')}
</script>

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

<ul>
    <li><a href="#/show/page1">1ページ目</a></li>
    <li><a href="#/show/page2">2ページ目</a></li>
    <li><a href="#/show/page3">3ページ目</a></li>
</ul>
<div id="page1" class="js-page">1ページ目の中身</div>
<div id="page2" class="js-page">2ページ目の中身</div>
<div id="page3" class="js-page">3ページ目の中身</div>
<script src="router.js"></script>
<script src="jquery.js"></script>

1
2
3
4
5
6

var router = new Router;
router.add('#/show/:id', function(req) {
    var id = req.get('id');
    $('.js-page').hide();
    $('#' + id).show();
});

1
2
3
4
5
6

router.add('#/hello', function() {
    alert('Hello');
})
.errors(404, function(err, href) {
    alert('not found')
});

1
2
3
4
5
6
7
8
9

router
  .add('#/login', routeLogin)
  .add('#/index', routeIndex)
  .add('#/logout', function(){
    session.expire();
    router.redirect('#/login');
  });

router.run('#/login');