Backbone.js查看已注册但未触发的事件

时间:2012-10-05 22:31:04

标签: backbone.js marionette backbone-views backbone-events

刚刚开始在这里,似乎无法让这个非常基本的工作。所有元素都按照我的期望呈现。我的事件在“事件”选项卡中的firefox中注册,但它们似乎都没有(点击,鼠标悬停等)。我正在使用以下内容。

  • backbone 0.9.2
  • 下划线1.4.1
  • Marionette .10.2
  • require-jquery(requireJs 2.1.0)(jquery 1.8.2)

路由器

define([
'jquery',
'backbone',
'underscore',
'views/TodaysProgramsView',
'collections/ProgramSnippetCollection'],
function($, Backbone, _, TodaysProgramsView, ProgramSnippetCollection){
    return Backbone.Router.extend({
        initialize:function () {

            var programSnippetCollection = new ProgramSnippetCollection([
                {title:'underwater basket weaving'},
                {title:'How to win friends and influence people and stuff'}
            ]);

            this.mainView = new TodaysProgramsView({
                el : $("#todays_programs"),
                collection:programSnippetCollection
            });

            Backbone.history.start();
        },
        routes:{
            '':'home'
        },
        'home':function () {
            this.mainView.render();
        }
    });
});

集合视图[TodaysProgramsView.js]

define([
'jquery',
'backbone',
'underscore',
'views/ProgramSnippetView'],
function($, Backbone, _, ProgramSnippetView){
    return  Backbone.Marionette.CollectionView.extend({

        events: {
            "click"   : "clicked"

        },
        clicked : function(){
            alert("parent clicked")
        },

       itemView : ProgramSnippetView
    });
});

项目视图[ProgramSnippetView.js]

define([
'jquery',
'backbone',
'underscore',
'text!templates/programSnippet.html'],
function($, Backbone, _, template){
    return Backbone.Marionette.ItemView.extend({


        events: {
            "click"   : "courseClicked",
            'mouseover' : 'mousedOver'
        },

        render: function(){

            var json = this.model.toJSON();
            console.log("RENDERING SNIPPET with data", json);
            $(this.el).html( _.template(template, json) );
            return this;
        },

        courseClicked : function(){
            alert("you clicked a course, good work");
        },

        mousedOver : function(){
            console.log("Mousin!");
        }
    });


});

1 个答案:

答案 0 :(得分:0)

经过很多挫折和几个小时的javascript调整后,我注意到有一个div设置的z-index为2.这覆盖了我的目标并吞噬了所有事件。叹息。

相关问题