更改el属性时未激发主干视图事件

Backbone View Event not firing when changing el property

本文关键字：视图 事件 el 属性 更改      更新时间：2023-09-26

我是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）；

根本不会触发按键事件。有人能向我解释一下为什么会发生这种情况，以及如何使代码正常工作吗？非常感谢大家。

Backbone使用视图的delegateEvents方法将jQuery delegate调用绑定到视图的el，该delegate处理视图的所有事件。如果你这样做：

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

你失去了绑定到this.el的delegate，你的事件也随之发生。你的this.$el也会与this.el不匹配，这也不好。更改视图的el的正确方法是使用setElement:

setElementview.setElement(element)

如果要将Backbone视图应用于其他DOM元素，请使用setElement，它还将创建缓存的$el引用，并将视图的委派事件从旧元素移动到新元素。

所以你应该可以这样做：

this.setElement($(template).replaceAll(this.el));
相关文章：