关于手动触发router,之前看到的例子都是通过在url后面加上#xxx或者点击一个a链接方法来触发,

还有一种情况是通过触发一种规则,来触发另一种规则(表述无能),比如这个例子中,我在url后面加上#manual,url的地址就转变为xxxx/route/n ,这里由于只给navigate传了一个参数,url改变之后并没有触发getId事件。

var AppRouter=Backbone.Router.extend({
routes:{
"route/:id":"getId",
"manual":"manual"
},
getId:function(id){
console.log(id);
}
,manual:function(){//当此事件触发时,url会转为route/n (n表示1-9的随机数)
this.navigate("route/"+Math.floor(Math.random()*9+1));
}
}); var app_router = new AppRouter;
Backbone.history.start();

如果需要触发事件,必须设置trigger的值:

var AppRouter=Backbone.Router.extend({
routes:{
"route/:id":"getId",
"manual":"manual"
},
getId:function(id){
console.log(id);
}
,manual:function(){//当此事件触发时,url会转为route/n (n表示1-9的随机数)
this.navigate("route/"+Math.floor(Math.random()*9+1),{trigger:true,replace:false});
}
}); var app_router = new AppRouter;
Backbone.history.start(); //控制台会输出一个1-9的随机数

关于replace这个值,文章中提到“replace表示url替换,而不是前进到这个url,意味着启用该参数,浏览器的history不会记录这个变动。

这是说,如果replace的值为false,那么这个例子中的#manual也会作为历史记录,所以我在点击浏览器中的后退按钮时,url会不断的产生新的随机路径,因为后退到manual的
瞬间,url又变了。

而如果replace的值为true,则是url替换,比如
打开一个新窗口,输入http://www.baidu.com
,再连续三次file:///D:/wamp/www/backbone_test/test.html#manual 回车
按下后退按钮时,发现页面回到了百度首页。这说明url的变化没有被记录到历史记录中。

Backbone.js入门教程第二版笔记(2)的更多相关文章

  1. Backbone.js入门教程第二版笔记(3)

    视图渲染 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <titl ...

  2. Backbone.js入门教程第二版笔记(1)

    1.模块 集合 视图 和事件的一个综合例子 <!DOCTYPE html> <html> <head> <meta charset="UTF-8&q ...

  3. Backbone.js入门教程

    原文: Getting Started with Backbone.js 不像其它的Web开发语言,过去Javascript很少可用的架构.令人感到高兴的是,最近几年这种情况得到非常大的改善. 今天我 ...

  4. D3.js 入门教程

    最近需要用到d3, 记录下d3的教程 网上搜了几个关于d3的教程 D3.js 入门教程      http://wiki.jikexueyuan.com/project/d3wiki/author.h ...

  5. 【特别推荐】Node.js 入门教程和学习资源汇总

    这篇文章与大家分享一批很有用的 Node.js 入门教程和学习资源.Node 是一个服务器端的 JavaScript 解释器,它将改变服务器应该如何工作的概念.它的目标是帮助程序员构建高度可伸缩的应用 ...

  6. python核心编程第二版笔记

    python核心编程第二版笔记由网友提供:open168 python核心编程--笔记(很详细,建议收藏) 解释器options:1.1 –d   提供调试输出1.2 –O   生成优化的字节码(生成 ...

  7. Node.js 入门教程和学习资源汇总

    这篇文章与大家分享一批很有用的 Node.js 入门教程和学习资源.Node 是一个服务器端的 JavaScript 解释器,它将改变服务器应该如何工作的概念.它的目标是帮助程序员构建高度可伸缩的应用 ...

  8. 【CC2530入门教程-增强版】基础技能综合实训案例(基础版)-上位机源码

    [CC2530入门教程-增强版]基础技能综合实训案例(基础版)-上位机源码 广东职业技术学院  欧浩源 一.需求分析 按照指定参数打开串口,与测控终端建立数据传输通道,并根据应用要求实现程序逻辑,具体 ...

  9. Vue.js 入门教程

    Vue.js 入门教程:https://cn.vuejs.org/v2/guide/index.html

随机推荐

  1. 区分虚拟机和machine simulator

    1 虚拟机和machine simulator的不同 虚拟机是让多个操作系统同时共用现有的硬件架构,它不会模拟新的硬件架构.qemu这样的模拟器是模拟新的硬件架构,这个架构和host不同.

  2. C++ HOJ 火车进站

    [问题描写叙述] 给定一个正整数N代表火车数量.0<N<10,接下来输入火车入站的序列,一共N辆火车,每辆火车以数字1-9编号. 要求以字典序排序输出火车出站的序列号. 输入:   有多组 ...

  3. kafka2

    Master-Slave: 读写分离,save复制master的数据.同步复制:保证了强一致性但是会影响高可用性,因为写入的时候要保证slave都写入了才能返回告诉生产者数据写入成功,如果slave过 ...

  4. HDU 2746 Cyclic Nacklace

    Cyclic Nacklace Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)T ...

  5. 666 专题三 KMP &#38; 扩展KMP &#38; Manacher

    KMP: Problem A.Number Sequence d.求子串首次出现在主串中的位置 s. c. #include<iostream> #include<stdio.h&g ...

  6. 牛人的ACM经验 (转)

    一:知识点     数据结构:       1,单,双链表及循环链表       2,树的表示与存储,二叉树(概念,遍历)二叉树的                    应用(二叉排序树,判定树,博弈 ...

  7. python startswith和endswith

    startswith判断文本是否以某个或某几个字符开始; endswith判断文本是否以某个或某几个字符结束; text = 'Happy National Day!' print text.star ...

  8. 「网络流24题」「LuoguP4015」 运输问题

    Description W 公司有 m 个仓库和 n 个零售商店.第 i 个仓库有 ai 个单位的货物:第 j 个零售商店需要 bj​ 个单位的货物. 货物供需平衡,即 ∑ai=∑bj​ . 从第 i ...

  9. 「网络流24题」「LuoguP4016」 负载平衡问题

    Description GGG 公司有 nnn 个沿铁路运输线环形排列的仓库,每个仓库存储的货物数量不等.如何用最少搬运量可以使 nnn 个仓库的库存数量相同.搬运货物时,只能在相邻的仓库之间搬运. ...

  10. JQ的双向数据绑定

    把渲染页面封装在function里面 在修改后直接调用,但是如果有alert();一定要注意function的摆放位置,正常应该是在alert前面,应为如果在后面会影响重新渲染的效果