Backbone.js 的 View 中定义事件

使用 Backbone 的 View 时,可以象传统 jQuery 那样定义事件,$("selector").click(function(){...})。幸运的是 Backbone 让我们在 View 中定义事件变得更为简单和集中,只要设置 View 的 events 属性,配置 事件,元素以及相应的处理方法,基本模式如下:

    events: {
        "click button": "event_handler",
        "focus #name": "event_handler"
    },
    event_handler: function( event ){
        alert(event.target.id);
    }

格式是 "事件 选择器": "事件处理函数名", 奇怪为什么这里不是使用事件处理函数名的引用,也就是不能写成下面两种方式:

也就不能更好的进行语法检查和一气呵成的写上面的事件代码。

还是上完整的演示代码

点击 http://fiddle.jshell.net/Unmi/2Dcy4/ 运行上面的代码,会发现在输入框失去焦点和点击 Button1 时都会触发事件的执行,但是点击 Button2 是不会触发 event_handler 事件处理方法的。也就是说上面绑定事件采用了如下代码:

"click button" 这句只会在 this.$el 范围内应用选择器查找元素来绑定事件。

参考: 1. What is a view?
        2. java12 Listening to DOM events in backbone js – Learning Backbone js

类别: Web/JS. 标签: , . 阅读(4,092). 订阅评论. TrackBack.

Leave a Reply

Be the First to Comment!

avatar