Backbone.js系列教程八:Backbone.History

Backbone.Router的功能是管理路由。Backbone.history是路由的一部分,负责监听和响应URL变化,包含浏览器历史的更新。Backbone.history()构造函数由Backbone库本身实例化,History()的一个实例是引用Backbone.history。这个Backbone.history对象有一个命名为start()的方法。调用这个方法通告Backbone开始监听路由并管理浏览器历史。该方法有一个选项对象提供下面的选项和值。


  1. Backbone.history.start({
  2.  
  3. /*Boolean,默认为假,true的意思是使用pushState如果可用,如果需要则退回哈希路径*/
  4. pushState:
    true,
  5.  
  6. /*Boolean,默认为真, 值为false的意思是假如pushState为真,则意味着浏览器不支持pushState,然后
  7. 进行基于URL路径的传统浏览器重载。如果pushState为假,同时hashChange为假,
  8. 那么url的改变,然后进行基于URL路径的传统浏览器重载。*/
  9. hashChange:
    false,
  10.  
  11. /*字符串默认为 '',backbone假定你的服务是从根路径开始 (也就是 /)。
  12. 一个非''的值是字符串路径,你的应用程序服务就从这个字符串路径开始,并且Backbone目录指向参照根目录。*/
  13. root:'',
  14.  
  15. /*Boolean,默认为假,值为真则意味着不运行默认路由(也就是'')。*/
  16. silent:
    true
  17.  
  18. });

你或许还从来没有创建过一个History()实例,但请注意,你将经常需要调用 Backbone.history.start(),以便开始监听hashchange事件和调用回调函数。

提示:

  1. 由于让哈希路径在IE中工作是依赖内嵌框架的,所以最好是在DOM准备好之后再调用start()。
  2. 当第一次调用start()时,将运行初始化路由。当.start()被调用时的初始化路由就是目前的url,它轮流调用关联了空白字符串属性名的路由。
  3. 在调用start().之前,你不需要定义所有的路由。假如你不使用初始化路由,在Backbone.Router()实例上,你可以在调用start()方法之后,通过调用route()方法定义其他路由。
  4. 路由不是从一个Backbone.router()实例开始,而是从Backbone.history()实例开始的。请记住,路由对象能够定义 路由,以及提供一个navigate()方法。但是为了让路由开始加载每个web页面到浏览器,你需要调用 Backbone.history.start()

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索实例
, 路由
, backbone
, 路径
, start
, pushstate
, history
, 监听路由变化
, history对象
js重载函数
,以便于您获取更多的相关知识。

时间: 2024-09-14 08:49:01

Backbone.js系列教程八:Backbone.History的相关文章

Backbone.js系列教程一 - Backbone.js简介

JavaScript在web应用程序开发前端技术和后端技术的逻辑与运行一块占有越来越大的比重.为了帮助维护和循环访问前期逻辑和模块性,MVC模式在近几年中渐渐普及.其中一种运用广泛的MVC框架就是Backbone.js. Backbone中的Models(模型).Views(视图)和Controller(控制器) Backbone.js包含以下几个主要功能: 创建模型(以及模型集合): 创建视图: 管理绑定,管理事件兼用不同的模型以及视图与框架其他部分的联系: 在模型中使用观察者模式,一旦模型触

Backbone.js系列教程九:Backbone实用程序库

利用Backbone.noConflict()存储和创建一个特殊的(就是自定义命名空间)引用到Backbone 当Backbone被浏览器解析时,Backbone做的第一件事就是存储一个引用到包含在全局作用域(也就是window.Backbone)中 的Backbone的值.这是因为Backbone重写或占据了这个命名空间,希望给开发者机会去存储在Backbone被解析之前使用的初值.这就是 Backbone.noConflict()起作用的时候了.调用Backbone.noConflict()

Backbone.js系列教程十:Backbone.View

在前几节中我们介绍了Backbone基础知识,如果你还没有阅读过,那么我建议你从第一节开始学习--Backbone.js系列教程一:Backbone.js初探,尤其希望你能完全理解构造Backbone对象相 关知识,这对于学习今后的内容有很大帮助.在接下来的几个小节中,我们将深入Backbone,讨论Backbone views.models和collections.相信大家在阅读前文之后,已经对Backbone.View.Backbone.Model. Backbone.Collection构

Backbone.js系列教程二:Backbone.js深入解析之基础要求

在网上关于Backbone的描述很少,现有的关于Backbone的内容五花八门,基本上都不同程度的提到了如何运用Backbone来实现应用程序的创建,当然也有很多的是讨论它是否匹配Model/View/Whatever.有挺多华而不实的视频教程是讲程序设计的,但其实没有什么太大的价值.我认为关键是缺少了关于Backbone本身的详细介绍,以及对于每行代码的真正用意的细节描述.有篇文档专门讲述Backbone各部分的功能,在一定程度上解答了上述问题,并且提供带有注释的源代码,还有更多相关Backb

Backbone.js系列教程四:Backbone全面介绍

Backbone的原理 Backbone的初衷在于单页面应用程序中添加架构,尤其是在创造DocumentCloud应 用程序的过程中,以避免重复性的DOM交叉以及DOM中用于保持UI同步的数据发生混乱.Backbone通过一套构造函数来完成这个步骤,于是就形成了 模型.集合与视图对象,目的在于组织应用程序的数据.逻辑和显示.一旦这些对象被具现化,它们彼此之间就存在特殊的关系,共同保证了应用程序的模块化.松 耦合性(利用event系统沟通).可扩展性. Backbone提供应用程序架构,还能帮助构

Backbone.js系列教程六:构造Backbone对象

Backbone构造函数 我之所以说Backbone很简单,是因为Backbone只有四个构造函数能被典型的实例化(基本上,它们首先被继承或子分类).这四种构造函数包括: Backbone.Model = function(attributes, {options}){}; Backbone.Collection = function([models], {options}){}; Backbone.Router = function({options}){}; //只能被具现化一次  Back

Backbone.js系列教程三:深入解析之框架,模型视图

Backbone下的框架设想 Backbone是用于开发SPA(AKA单页应用)环境.你可能想要知道这些是什么.简单的讲,SPA就是一个加载了一个页面 (index.html或者app.html)的web应用,整个应用通过自定义事件,自定义URL句柄,和异步HTTP检索,存储资源来发送到客户端, 这样避免了页面的重复加载.基本上,SPA框架只加载一个HTML页面,因此JavaScript可以用于仿写/重写/编排浏览器上传统web应用框架的 默认属性. 让我们检验Backbone SPA的框架假设

Backbone.js系列教程五:Backbone.Events

Backbone.Events概述 Backbone.Events对象包含的方法有助于observer设计模式和一个调用pub/sub的可变observer模式.这些功能允许Backbone创建的不同类的对象(JavaScript对象)彼此解耦而相互通信.这是通过扩展(也就是_.extend(Model.prototype, Backbone.Events);)以下构造函数而完成的,所使用的函数都属于Backbone.Events: Backbone.Model() Backbone.Colle

Backbone.js系列教程七:Backbone.Router

Backbone.router()概述 一个Backbone route是一个JavaScript字符串,类似于传统认识中的URL路径名. 这个像字符串的路径名是一个函数的属性名(或引用命名函数),当在浏览器中有url与字符串匹配时被调用.举例来说,下例中的url包含路径名 "help" ,在一个单独的Backbone应用页面中它将通告Backbone调用一个函数,这个函数关联了名为'help"的路由. http://www.hostname.com/#help 请注意,路径