Backbone.js的Hello World程序实例_其它-js教程-PHP中文网

Backbone.js的Hello World程序实例_其它

php中文网

发布： 2016-05-16 15:53:50

原创

1442人浏览过

新建一个api.php文件，内容：

 header('Content-Type: application/json; charset=utf-8');

die(json_encode(array('name'=>'tom')));

新建一个index.html文件。(backbone基于jquery、underscore，我们使用mustache来做模板解析，当然用其他的haml、jade，或者underscore里面的模板也都是可以)

内容：

复制代码代码如下:

New Document

iOS开发学习之iOS多线程和RunLoop 中文WORD版

iOS多线程编程对于iOS开发初学者来说，总是会觉得很难理解和掌握，现在通过几个实例来更加系统全面的理解iOS多线程编程，希望对大家有所帮助。有些程序是一条直线，起点到终点；有些程序是一个圆，不断循环，直到将它切断。直线的如简单的Hello World，运行打印完,它的生命周期便结束了，像昙花一现那样；圆如操作系统，一直运行直到你关机。一个运行着的程序就是一个进程或者叫做一个任务，一个进程至少包含一个线程，线程就是程序的执行流。Mac和iOS中的程序启动，创建好一个进程的同时，一个线程便开始运行，

查看详情

{{name}} says: {{message}}

新建一个custom.js文件，内容：

复制代码代码如下:

// 这是一个管理着 视图/控制/模型 的全局类

var App = {

    Models: {},

Views: {},

Controllers: {},

Collections: {},

initialize: function() {

new App.Controllers.Routes();

        Backbone.history.start() // 要驱动所有的Backbone程序，Backbone.history.start()是必须的。

    }

};

App.Models.Hello = Backbone.Model.extend({

    url: function() {

        return '/api.php'; // 获得数据的后台地址。

    },

    initialize: function() {

     this.set({'message':'hello world'}); // 前端定义一个message字段，name字段由后端提供。

    }

});

App.Views.Hello = Backbone.View.extend({

el: $("body"),

template: $("#hello-container-template").html(),

initialize: function(options){

this.options = options;

this.bind('change', this.render);

this.model = this.options.model;

},

render: function(){ // render方法，目标只有两个：填充this.el，返回this以便链式操作。

$(this.el).html(Mustache.to_html($(this.el).template,this.model.toJSON()) );

return this

}

});

App.Controllers.Routes = Backbone.Controller.extend({

routes: {

"!/hello" : "hello",//使用#!/hello驱动路由

},

hello : function() {

//新建一个模型，模型向后端请求更新内容成功后根据模型渲染新页面

var helloModel = new App.Models.Hello;

helloModel.fetch({

success: function(model){

var helloView = new App.Views.Hello({model: model});

helloView.trigger('change');

}

})

}});

App.initialize();