zoukankan      html  css  js  c++  java
  • Backbone.js之view篇(三)

    Backbone 的 Views 用来接收用户的操作和修改 Model 的数据 ,另外通过 render 来展示数据.

    实际上,在MVC框架中,它更像是Controller。


    View有两个作用:

    1.监听事件

    2.展示数据


    下面简单的创建一个View:

    1. GameView= Backbone.View.extend({ 
    2.   tagName : "div", 
    3.   className: "game", 
    4.   render : function() { 
    5. // code for rendering the HTML for the view
    6.   } 
    7. }); 

    下面让我们看看render部分应该怎么写。如下:

    1. render : function() { 
    2. this.el.innerHTML = this.model.get('name'); 
    3. //Or the jQuery way
    4. $(this.el).html(this.model.get('name')); 

    更全面的示例:

            var DocumentView = Backbone.View.extend({

             events: { 

    1. "dblclick"                : "open", 
    2. "click .icon.doc"         : "select", 
    3. "contextmenu .icon.doc"   : "showMenu", 
    4. "click .show_notes"       : "toggleNotes", 
    5. "click .title .lock"      : "editAccessLevel", 
    6. "mouseover .title .date"  : "showTooltip"
    7.   }, 
    8.   render: function() { 
    9.     $(this.el).html(this.template(this.model.toJSON())); 
    10. return this; 
    11.   }, 
    12.   open: function() { 
    13.     window.open(this.model.get("viewer_url")); 
    14.   }, 
    15.   select: function() { 
    16. this.model.set({selected: true}); 
    17.   }, 
    18.   ... 
    19. }); 

    events部分是监听的事件,下面的open、select方法是事件对应的处理。

    本文引用:http://blog.csdn.net/feng88724/article/details/7290338

  • 相关阅读:
    ThinkJS框架入门详细教程(一)开发环境
    为什么要使用云盘?
    博客使用BOS上传图片
    网站第三方评论对比
    Angular定义服务-Learn By Doing
    原生Ajax总结
    JavaScript事件概览
    Angular学习-指令入门
    Angular中ngCookies模块介绍
    Angular Service入门
  • 原文地址:https://www.cnblogs.com/yichengbo/p/2621196.html
Copyright © 2011-2022 走看看