javascript - 骨干事件未触发

Question

试图让一个事件在视图中触发，但它似乎没有触发。此视图在另一个视图中运行，因此不确定是否未正确设置事件。

var ListRow = Backbone.View.extend(
{
    events:
    {
        'click .button.delete': 'destroy'
    },

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

    render: function()
    {
        this.el = _.template($('#tpl-sTableList_' + key + 'Row').html());

        return this;
    },


    destroy: function()
    {
        console.log('remove')
    }
});

Answer 1

你正在覆盖你的this.el，你想要做的是

render: function ()
{
    var tpl = _.template($('#tpl-sTableList_' + key + 'Row').html());
    this.$el.empty().html(tpl);
    // or if you prefer the old way
    // $(this.el).empty().html(tpl);
    return this;
},

如果这导致您的 DOM 表示出现问题，其周围有一个额外的包装元素，请尝试以下方法：

render: function ()
{
    var tpl = _.template($('#tpl-sTableList_' + key + 'Row').html());
    this.setElement(tpl, true); // this is a Backbone helper 
    return this;
},