Backbone：$（e.currentTarget）返回undefined

Question

另一个骨干问题 下面提到的观点很好 但是，单击链接时，以下行不会执行：

console.log( $(e.currentTarget).data("id"));

但是返回一条消息（所以事件被正确触发）：

Uncaught TypeError: undefined is not a function 

这是观点：

define([
    'jQuery', 
    'marionette', 
    'handlebars', 
    'text', 
    'text!templates/main_menu.html', 
], function ($, Marionette, Handlebars, Text, Main_menu_tpl) {
    'use strict';

    var Main_MenuView = Marionette.ItemView.extend({

        template: Handlebars.compile(Main_menu_tpl), 

        events: {
            'click .main_menu_item':'select_menu'
        },

        select_menu: function(e){
            e.preventDefault();
            //Here is the problem 
            console.log( $(e.currentTarget).data("id"));
        },

        render: function () {
                    var wrapper  = {models: this.collection.toJSON()};
                    this.$el.html(this.template(wrapper));
                    return this;
        }
    });

    return Main_MenuView;
});

模板如下所示：

<ul id="main-menu">
    {{#each models}}
        <li><a data-id="{{id}}" href="{{href}}" class='main_menu_item'">{{label}}</a></li>
    {{/each}}
</ul>

Answer 1

问题在于我将main.js中的jQuery依赖项（使用require.js）从CDN定义为“jQuery”而不是“jquery”。

但是，由于@AlbertoZaccagni的一些支持，我第一次使用compositeview来优化我以前的代码。

当前代码：

创建基于集合

显示的复合视图

var main_menuView = new Main_menuCompositeView({collection: Header_menuCollection});
Zwoop.main_layout.headerRegion.show(main_menuView);

创建项目视图

define([
    'jquery', 
    'marionette', 
    'handlebars', 
    'text', 
    'text!templates/main_menu_item_tpl.html', 
], function ($, Marionette, Handlebars, Text, Main_menu_item_tpl) {
    'use strict';

    var Main_Menu_ItemView = Marionette.ItemView.extend({
        tagName: "li",
        template: Handlebars.compile(Main_menu_item_tpl), 
        events: {
            'click .main_menu_item':'select_menu'
        },
        select_menu: function(e){
            e.preventDefault();
            console.log( $(e.currentTarget).data("id"));
        }        
    });

    return Main_Menu_ItemView;
});

创建compostie视图：

define([
    'jquery', 
    'marionette', 
    'handlebars', 
    'text', 
    'text!templates/main_menu_composite_tpl.html',     
    'views/main_menuItemView'
], function ($, Marionette, Handlebars, Text, Main_menu_composite_tpl, Main_menuItemView) {

    var Main_menuCompositeView = Marionette.CompositeView.extend({
        template: Handlebars.compile(Main_menu_composite_tpl), 
        tagName: "ul",
        itemView: Main_menuItemView
    });

    return Main_menuCompositeView;
});