在骨干.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();
}