首页 > 代码库 > Backbone.js入门教程第二版笔记（1）
Backbone.js入门教程第二版笔记（1）
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>Document</title> <script src="http://www.mamicode.com/jquery-1.9.1.js"></script> <script src="http://www.mamicode.com/underscore.js"></script> <script src="http://www.mamicode.com/backbone.js"></script></head><body> <button id="check">新手报到</button> <ul id="world-list"> </ul> <script> (function ($) { var World=Backbone.Model.extend({ name:null //为什么要创建一个空的name }); var Worlds=Backbone.Collection.extend({ initialize:function(models,options){ this.on("add", options.view.addOneWorld);//初始化绑定add方法 } }); var AppView=Backbone.View.extend({ el:$(‘body‘),//指定关联的元素 initialize:function(){//初始化方法 this.worlds=new Worlds(null,{view:this})//实例化一个集合，并且建一个属性view用来保存视图 }, events:{ ‘click #check‘:"checkIn"//绑定#check的click事件 }, checkIn:function(){ var world_name=prompt("请问，您是哪星人?"); world_name||(world_name = ‘未知‘); var world=new World({name:world_name});//实例化一个模块，并设置name的值 this.worlds.add(world);//将模块添加到集合 }, addOneWorld:function(model){ $("#world-list").append("<li>这里是来自 <b>" + model.get(‘name‘) + "</b> 星球的问候</li>"); } }); var appview = new AppView;//实例化AppView })(jQuery); </script></body></html>
Backbone.js入门教程第二版笔记（1）
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。