Question

我有两个关于DOM事件的问题。

我想在DOM上触发事件，我写了这段代码：

window.homeView = Backbone.View.extend({
    el : $('#home-container'),

    initialize : function() {
       this.template = _.template($('#home-template').html());
       this.render();
    },

    events: {
      "click a.fb_connect": 'fetch_user'
    },

    fetch_user: function(){
        console.log("Fetch requested...");
    },

    render : function() {
        this.delegateEvents();
        var renderedContent = this.template(this.model.toJSON());
        $(this.el).html(renderedContent);
        return this;
    }

});

当我点击我的链接<a class="fb_connect" href="#"><img src="img/fb-connect.png" alt="fb-connect" /></a>时，没有任何事情发生......我不知道为什么，任何想法？

另一个问题，我听说过“自定义事件”，我想在这里做的是触发一个关于我的facebook登录的事件，所以在我的例子中（这不起作用），我在点击时调用我的事件在链接上，但我应该在facebook回调中调用事件以确保我获得了数据，问题是，facebook回调不是DOM事件，所以我不知道如何触发它，是否有这些方法“自定义事件”做这种事情？

感谢您的帮助！

修改：http://jsfiddle.net/ludoblues/japNK/3/

Answer 1

问题是您的链接不是视图定义的元素的一部分。

您已将此作为模板：

<script type="text/template" id="home-template">
            <span><%= id %></span>
            <span><%= username %></span>
            <span><%= facebook_id %></span>
            <span><%= facebook_token %></span>
</script>

这不包含您要附加事件的元素。

通过Backbone的事件哈希附加事件通过使用jQuery中on方法的委托能力来工作，但因为它不知道（或想知道）模板实际附加到DOM的时间（和因此可以访问它，它将它们附加到Backbone创建的周围元素，在您的情况下由el : $('#home-container')

定义

因此，当Backbone附加事件时，它使用：

this.$el.on("click", "a.fb_connect", this.fetch_user);

this.$el所提供的jQuery包裹el（或el，tagName和className组合生成的id ）。

由于<a class="fb_connect"...></a>不是<div id="home-container>的子项，因此jQuery只会监听fb_connect类div#home-container的{{1}}的锚标记上的点击事件。 1}}。

如果您将模板更改为：

<script type="text/template" id="home-template">
            <span><%= id %></span>
            <span><%= username %></span>
            <span><%= facebook_id %></span>
            <span><%= facebook_token %></span>
            <a href="#" class="fb_connect">OK !</a>
</script>

有效。（在小提琴中确认）。

这是documentation for .on from jQuery，这将有助于更详细地解释这一点。

更新了jsfiddle

Answer 2

关于第一个问题，请查看at this answer;你有没有等待DOM做好准备？

对于第二个，当你不能依赖Backbone视图中的模型/收集事件时，我建议使用pub / sub库：this one有我的偏好。

无法抓住我的活动

2 个答案: