实例讲解JavaScript的Backbone.js框架中的View视图_基础知识

事件名称可以是DOM对象支持的任何事件，选择器可以是jQuery或Zepto支持的任意选择器字符串（包括标签选择器、类选择器、id选择器等），而事件处理函数应该是已经定义在视图类本身的方法名称。

视图对象会自动解析events列表中的描述，即使用jQuery或Zepto获取选择器描述的DOM对象，并将事件处理函数绑定到事件名称中。这些操作都会在视图类被实例化时自动完成，我们可以更关心视图类本身的结构，而不是刻意地去考虑如何绑定事件。
你可能在担心另外一个问题：如果视图的DOM结构是动态生成的，Backbone是否提供了相应的方法用于动态绑定和解除事件？

其实你并不需要关心这个问题，因为events中的事件是通过delegate()方法绑定到视图对象的el元素上，而并非是选择器所描述的元素。因此视图内的结构无论如何变化，events中的事件都是有效的。

（如果你对jQuery比较熟悉，可能了解它所提供的delegate()方法。该方法实际上将事件绑定在父层元素，然后在事件冒泡过程中，通过检查目标子元素来触发事件。）

视图对象通过delegate()方法绑定事件，意味着我们不需要关心视图结构变化对事件产生的影响，同时也说明events中选择器所对应的元素必须处于视图的el元素之内，否则绑定的事件是无法生效的。
尽管如此，有些情况下可能我们仍然需要手动绑定和解除事件，视图对象提供了delegateEvents()和undelegateEvents()方法用于动态绑定和解除events事件列表，你可以通过查看API文档来了解它们。 

渲染视图和数据

视图主要用于界面事件的绑定和数据渲染，然而视图对象仅仅提供了一个和渲染相关的方法render()，并且它是一个没有任何逻辑、也没有任何地方引用到的空方法，我们需要重载它来实现自己的渲染逻辑。

视图中可能包含许多界面逻辑，这里建议所有的视图子类都重载render()方法，并将它作为最终渲染的入口方法。在团队开发中，严格按照规范编码可以帮助别人更好地理解和维护你的代码。　　 




    

    

    

        
实例讲解JavaScript的Backbone.js框架中的View视图_基础知识
        
实例讲解JavaScript的Backbone.js框架中的View视图_基础知识:Backbone 中的 View 用来反映你 app 中 Model 的模样。它们会监听事件并作出相应的反应。 接下来的教程我不会告诉你如何把 Model 和 Collection 绑定到 View 上，而是主要讨论 View 是如何使用 javascript 模板库的，尤其是 Underscore
        
推荐度：

    
    

        
            点击下载本文
            文档为doc格式
        
    

              
        
                

            标签：
                        js
                        javascript的
                        backbone
                    
                
            
            
 
                    

                        
热门焦点