在渲染视图后，后台事件不会触发

Question

我有一个在路由器中呈现的视图，但在呈现之后，没有任何事件会被触发。以下是我的观点：

function(Global, util, user, userMenu) { 
        /*userMenu is the template*/
        var UserMenuView = Backbone.View.extend({
            initialize: function() {
                this.template = _.template(userMenu);
            },
            render: function() {
                var container = $(this.el);
                container.empty().append(this.template());
                return container;
            },
            events: {
                "tap #about-user-menu" : "launchAbout",
                "keydown #about-user-menu": function(e) { if (e.which === 13) this.launchAbout(e); },
                "tap #help-user-menu" : "launchHelp",
                "keydown #help-user-menu": function(e) { if (e.which === 13) this.launchHelp(e); },
                "tap #resources-user-menu" : "launchResources",
                "keydown #resources-user-menu": function(e) { if (e.which === 13) this.launchResources(e); },
            },
            launchAbout: function(e){
                e.preventDefault();
                alert("about");
            },
            launchHelp: function(e){
                e.preventDefault();
                alert("help");
            },
            launchResources: function(e){
                e.preventDefault();
                alert("resources");
            }
        });
        return UserMenuView;
    }

这就是我在路由器中呈现视图的方式：

showUserMenu: function(){
    var userMenu = new UserMenuView();
    userMenu.render();
}

Answer 1

代码中的

this.template()只返回一个HTML字符串，导致问题。

所以你应该尝试追加el字符串的HTML元素以及Event bindings

现在在您的视图中将HTML分配给el

render: function() {
           this.$el.html(this.template());
           return this;
          }

路由器中的

$('#menu').append(UserMenuView.render().el);