Question

我有以下Backbone视图：

var EditBook = Backbone.View.extend({

    el: '.page',

    render: function (id) {

        var that = this,

            book = new Book({
                id: id
            });

        book.fetch({

            success: function (res) {

                var template = _.template(editBookTpl, {
                    bookInfo: res
                });

                that.$el.html(template);
            },

            error: function () {

                console.log('Error! Could not retrieve the book.');
            }

        });
    },

    events: {

        // This event doesn't work...
        'submit .editBookButton': 'editBook'
    },

    // I cannot seem to be able to bind the submit event to the .editBookButton

    editBook: function (e) {

        e.preventDefault();

        console.log('clicked');
    }
});

我所做的是使用underscore.js加载模板

在模板内部有一个表单，其中包含一个具有类.editBookButton

的提交按钮

我想使用Backbone的事件，但它不起作用。

关于为什么的任何想法？

是否有办法确保仅在此视图中仅针对具有此类的元素触发事件？

我发现了一个类似的问题，但答案并不完整。

Answer 1

按钮没有submit事件，只有表单有。

因此，您应该尝试在submit元素上捕获form事件。

Answer 2

不使用按钮选择器，而是使用表单选择器。

假设html代码为：

<form class="editBook">...<button type="submit">Submit</button></form>

然后代码将是：

events: {
    'submit .editBook': 'editBook' 
}

Backbone事件不会通过提交触发

2 个答案: