0

我一直在尝试学习backbone.js，但我无法弄清楚为什么当我点击主页链接时我的点击事件没有触发。我对骨干很陌生，我只是不确定我错过了什么？我在网上查了很多不同的教程，但似乎找不到失败的洞。请帮忙！

骨干网.js

    var HomeView = Backbone.View.extend({
        el: $('.content'),

        events:{
            "click #home": "animateNavigation"
        },
        initialize: function(){
            _.bindAll(this, 'displayTrips'); 

            // Add the model collections
            this.collection = new ModelList();
            this.collection.bind('add', this.displayTrips); // Collection event binder
        },
        animateNavigation: function(){
            alert('test');

            return false;
        },
        displayTrips: function(params){
            var items = params.get('data');
        }
    });

    var home_view = new HomeView();

HTML

<div class="content">
     <div class="left">
        <ul>
            <li>
                <div class="nav_arrow"></div>                   
                <a href="home" class="active" id="home">
                    <img alt="Home" src="/assets/img/nav/left/star.png">
                    <span>Home</span>
                </a>
            </li>
            <li>
                <a href="tropical" id="tropical">
                    <img alt="Tropical" src="/assets/img/nav/left/fins_grey.png">
                    <span>Tropical</span>
                </a>
            </li>
        </ul>
    </div>
</div>
4

3 回答 3

1

您在声明模型时找到元素。如果您的脚本位于标题或此内容之前的任何位置，则该元素尚不存在。我不知道应该有什么好的理由在$('.content')这里使用，只需使用'.content'

编辑：嗯，我看到你也在声明你的视图的一个新实例。我不知道该行是否真正代表了您在脚本中的内容，或者您​​只是为了展示您的基本用途而将其放在那里。我通常在页面逻辑的其他地方定义视图和模型（这将具有这些事物的实例），主要是为了我可以重用它们。

于 2012-08-16T14:34:32.260 回答
0

我发现这为我解决了这个问题：

var home_view = new HomeView({el:$('.content')});

更新 - 比这更好，这样做：

var home_view = new HomeView({el:'.content'});

然后this.$el将按照上面的帖子所说的那样工作

于 2012-11-30T17:05:48.360 回答
0

你能补充一下吗

console.log(home_view.$el.html());

最后，请检查 home_view 的 Dom 元素。我假设将视图绑定到 Dom 元素时出现问题。

于 2012-08-16T14:28:36.533 回答