在骨干.js视图中使用当前的jQuery元素

Question

越来越不了解骨干.js，但我遇到了一些束缚。 我已经成功创建了一个视图，并且能够将事件委托给DOM中的元素，但是在以下情况下，我似乎可以使用jQuery“ $(this) ”

Chrono.Views.Sidebar = Backbone.View.extend({
    //Page wrapper
    el:"#wrapper",

    //Delegate events to elements
    events : {
        "click .push-to":"loadPage"
    },
    loadPage: function(event) {
        var url = $(this).attr("href");
        alert(url);
        event.preventDefault();
    }
});

点击事件是拦截事件，但这一行“ var url = $（this）.attr（“ href”）;“

Answer 1

在loadPage的上下文中， this已绑定到您的Chrono.Views.Sidebar实例。 但是，您可以通过event.currentTarget获取触发事件的DOM元素。 如果您将函数更新为如下所示，则它应该可以工作：

loadPage: function(event) {
    var url = $(event.currentTarget).attr("href");
    alert(url);
    event.preventDefault();
}

Answer 2

在主干中，它绑定到视图，但是您仍然可以通过使用event.currentTarget检查event.target或绑定到事件的元素来获取被单击的元素。

看看这个问题Backbone.js事件绑定

Answer 3

this是绑定到视图的，因此您可以直接访问View.$el属性。

loadPage: function(event) {
    var url = this.$el.find('.push-to').attr('href');
    alert(url);
    event.preventDefault();
}