Backbone View事件在更改el属性时不触发

Question

我是Backbone的新手,试图做一些例子,但我坚持这个.我有以下BackBone视图:

CommentBoxView = Backbone.View.extend({
    initialize: function () {
        this.render();
    },
    render: function () {
        var template = _.template( $("#comment_box_template").html(), {} );
        this.el.html(template);
    },
    events: {
        "keypress textarea": "doKeyPress"
    },
    doKeyPress: function (event) {
        console.log(event);
    }
});

一切都运行正常,但如果我更换

this.el.html(模板);

有了这个:

this.el = $(template).replaceAll(this.el);

按键事件根本没有被触发.任何人都可以向我解释为什么它发生以及如何使这个代码有效？非常感谢你们.

Answer 1

Backbone使用视图的delegateEvents方法将jQuery delegate调用绑定到视图el,这delegate是处理所有视图事件的方法.如果你这样做:

this.el = $(template).replaceAll(this.el);

你失去了delegate约束this.el,你的事件随之发生.你也最终得到了this.$el不匹配的东西this.el,这也不好.更改视图的正确方法el是使用setElement:

setElement view.setElement(element)

如果您想将Backbone视图应用于不同的DOM元素,请使用setElement,它还将创建缓存的$el引用,并将视图的委托事件从旧元素移动到新元素.

所以你应该能够这样做:

this.setElement($(template).replaceAll(this.el));