Backbone的View有一个remove方法，这个方法除了删除View所关联的DOM对象，还会阻断事件侦听，它通过在listenTo方法时记录下来的那些被侦听对象(上文事件原理中提到)，来使这些被侦听的对象删除对自己的引用。在remove内部使用事件基类的stopListening完成这个动作。
上面的代码使用一个views数组来跟踪新创建的TaskView对象，并在render的时候，依次调用这些视图对象的remove，然后清空数组，这样这些TaskView对象就能得到释放。并且，除了调用remove，还调用了off，把视图对象可能的被外部的侦听也断开。
事件驱动模块
自定义事件：自定义事件比较适合多人合作开发，因为我们知道，函数名如果一样的话，那么后面的函数会覆盖前面的，而事件在绑定的情况下是不会被覆盖的。
<script type="text/javascript"> //自定义事件 var Mod = backbone.Model.extend({ defaults : { name : 'trigkit4'; }, initialization : function(){ //初始化构造函数 this.on('change',function(){ //绑定change事件，当数据改变时执行此回调函数 alert(123); }); } }); var model = new Mod; model.set('name' ,'backbone');//修改默认的name属性值为backbone，此时数据被改变，弹出123 </script>
事件绑定
除此之外，我们还可以自定义要绑定的被改变的数据类型：
object.on(event, callback, [context])
绑定一个回调函数到一个对象上， 当事件触发时执行回调函数 ：
<script type="text/javascript"> //自定义事件 var Mod = backbone.Model.extend({ defaults : { name : 'trigkit4', age : 21; }, initialization : function(){ //初始化构造函数 this.on('change:age',function(){ //绑定change事件，当数据改变时执行此回调函数 alert(123); }); } }); var model = new Mod; model.set('name' ,'backbone');//修改默认的name属性值为backbone，此时数据被改变，弹出123 </script> listenTo <script type="text/javascript"> $(function(){ var Mod = Backbone.Model.extend({ defaults : { name : 'trigkit4' } }); var V = Backbone.View.extend({ initialize : function(){ this.listenTo(this.model,'change',this.show);//listenTo比on多了个参数 }, show : function(model){ $('body').append('<div>' + model.get('name') + '</div>'); } }); var m = new Mod; var v = new V({model:m});//model指定创建的模型对象m,即前面的路由，哈希值的对应 m.set('name','hello');//对模型进行就改时，触发事件，页面也就更新了 }); </script>
istenTo
<script type="text/javascript"> $(function(){ var Mod = Backbone.Model.extend({ defaults : { name : 'trigkit4' } }); var V = Backbone.View.extend({ initialize : function(){ this.listenTo(this.model,'change',this.show);//listenTo比on多了个参数 }, show : function(model){ $('body').append('<div>' + model.get('name') + '</div>'); } }); var m = new Mod; var v = new V({model:m});//model指定创建的模型对象m,即前面的路由，哈希值的对应 m.set('name','hello');//对模型进行就改时，触发事件，页面也就更新了 }); </script>
模型集合器
Backbone.Collection
集合是模型的有序组合，我们可以在集合上绑定 "change" 事件，从而当集合中的模型发生变化时获得通知，集合也可以监听 "add" 和 “remove" 事件， 从服务器更新，并能使用 Underscore.js 提供的方法
路由与历史管理
<script type="text/javascript"> var Workspace = Backbone.Router.extend({ routes: { "help": "help", "search/:query": "search", "search/:query/p:page":" search" }, help : function(){ alert(123); }, search : function(query,page){ alert(345); } }); var w = new Workspace; Backbone.history.start();//backbone通过hash值找到对应的回调函数 </script> 事件委托 <script type="text/javascript"> $(function(){ var V = Backbone.View.extend({ el : $('body'), //对events进行集体操作 events : { "click input" : "hello", "mouseover li" : "world" }, hello : function(){ alert(1234); }, world : function(){ alert(123) } }); var view = new V; }); </script> <body> <imput type = "button" value = "hwx" /> <ul> <li>1234</li> <li>1234</li> <li>1234</li> <li>1234</li> <li>1234</li> </ul> </body>
事件委托 格式：事件 + 空格 + 由谁来触发 ： 对应的回调函数
您可能感兴趣的文章: