Question

我正在尝试添加BaseView，为我的模块中的所有Backbone视图执行一些初始化。

这是fiddle，代码转载于下方

创建自定义BaseView并让它订阅调度程序上的“close”事件。因此，让它成为所有孩子的一部分。

var dispatcher = _.clone(Backbone.Events);

var ctor = Backbone.View;
var BaseView = Backbone.View.extend({
    //override Backbone's constructor
    constructor: function(options) {

        ctor.apply(this, arguments);

        dispatcher.on('close', this.close, this);

    },

    close: function() {

        console.log(this.cid);

    }

});

//Is this really needed??
BaseView.prototype.constructor = Backbone.View;

创建从BaseView继承的子视图：

var View = BaseView.extend({
    el: '#clickholder',

    initialize: function() {
        _.bindAll(this);
    },

    //Events not bound?
    events: {
        "click #clicker": "clicked"
    },

    //never called :(
    clicked: function(e) {
        alert("clicked button");
    }
});

new View();

这是HTML：

<div id="clickholder">
<button id="clicker">Clicker</button>
</div>

问题：如果单击该按钮，则永远不会触发该事件，并且永远不会显示警报。我不确定问题是什么。我已经花了很长时间才能看到它，但无法理解为什么events没有被约束View？我做错了什么？

PS：这是基于答案here。我专门创建了一个BaseView类，以便不会在我的应用程序中对所有Backbone Views产生全局影响，只是将其限制在特定模块

更新：根据@ mu的答案修正小提琴。在div中包含按钮似乎也无法解决问题。我错误地将视图直接绑定到按钮以简化。在我的主应用程序中，按钮位于视图的“内部”，因此委托在上面的BaseView实现之前工作得很好。

Answer 1

你有一些问题：

您的Backbone代码正在文档<head>中运行，因此运行时没有#clicker，因此无法将事件绑定到。
您的观看次数el应为#clicker，但您的活动正在尝试绑定到 {{1}内的#clicker }}。来自fine manual：

delegateEvents el

[...]省略delegateEvents([events])会导致事件绑定到视图的根元素（selector）。

如果要绑定this.el上的点击，则需要：

el

更新了演示：http://jsfiddle.net/ambiguous/fTrSj/

为什么＆＃39;事件＆＃39;从Backbone中的自定义BaseView扩展时不会绑定到View？

1 个答案: