backbone与后台交互，使用RESTFUL风格， 后台使用tinkphp进行接收请求。 一、添加 [cra […]
backbone
backbone.js（五）Router
一、基本用法
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
/** * 路由器 Router */ var NoteRouter = Backbone.Router.extend({ // 定义路由规则 routes: { notes: 'index', }, // 具体实现操作 index: function() { jQuery( '#note_list' ).html( noteCollectionView.el ); console.log( '笔记列表' ); } }); // 路由 var noteRouter = new NoteRouter(); // 开始监视hashchange事件 Backbone.history.start(); |
假设域名为www.notes. […]
backbone.js（四）Collection
backbone.js（三）View
一、基本方法
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
/** * View 试图 */ var NoteView = Backbone.View.extend({ // 标签名 tagName : 'li', // 类 className: 'item', // 属性 attributes: { 'data-role': 'list' } }); var noteView = new NoteView(); console.log( noteView.el ); // <li data-role="list" class="item"></li> |
二、视图绑定模型 [cray […]
backbone.js（二）Model
一、基本方法
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 |
/** * 模型 */ var Note = Backbone.Model.extend({ // 定义默认属性 defaults: { title: 'one note', create_at: new Date() }, // 初始化，执行方法 initialize: function() { console.log( '新创建了一条笔记：' + this.get( 'title' ) ); } }); // 创建note1实例 var note1 = new Note( { title: 'Hello', author: 'cc' } ); // 获取属性 console.log( note1.get( 'title' ) ); // Hello console.log( note1.get( 'notitle' ) ); // undefined // 获取所有属性 console.log( note1.toJSON() ); // Object {title: "Hello", author: "cc"} console.log( note1.attributes ); // Object {title: "Hello", author: "cc"} // 是否存在某个key值 console.log( note1.has( 'title' ) ); // true console.log( note1.has( 'notitle' ) ); // false // 删除属性 note1.unset( 'title' ); // 设置属性 note1.set( 'hello', 'world' ); note1.set( { content: 'nihao, 第一个笔记', title: 'Hello' } ); console.log( note1.toJSON() ); // Object {author: "cc", hello: "world", content: "nihao, 第一个笔记", title: "Hello"} // 清空所有属性 note1.clear(); |
二、事件 当使用set方法改 […]