0

我有 2 个关于 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/

4

2 回答 2

1

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

你有这个作为你的模板：

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

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

通过 Backbone 的事件散列附加事件通过使用onjQuery 方法的委托能力起作用，但由于它不知道（或想知道）您的模板何时实际附加 DOM（因此可访问），它将它们附加到由 Backbone 创建的周围元素，在您的情况下定义为el : $('#home-container')

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

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

this.$el提供的 jQuery 包装在哪里el（或由、和el的组合生成）。tagNameclassNameid

因为<a class="fb_connect"...></a>is not a child of <div id="home-container>the click 事件永远不会被触发，因为 jQuery 只侦听fb_connect带有div#home-container.

如果您将模板更改为：

<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>

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

Here's the documentation for .onfrom jQuery这将有助于更详细地解释这一点。

和更新的jsfiddle

于 2012-10-09T18:14:00.520 回答
0

对于您的第一个问题，请查看此答案；您是否等待 DOM 准备就绪？

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

于 2012-10-09T16:58:47.757 回答