Устранение неполадок с одним из нескольких прослушивателей событий в представлении Backbone.js

Question

Я пытаюсь удалить прослушиватель событий из определенного объекта DOM и возникли проблемы. Ниже показаны части кода я играю с:

Search.Views.MainSearch = Backbone.View.extend({ 
    // initialization function 
    events: { 
     'click #search-submit' : 'searchSubmit', 
     'click #some-button': 'disableSearch', 
     'click #some-other-button': 'someFunction' 
    }|, 
    disableSearch: function(){ 
     // this statement works, but it removes all listeners 
     $(this.el).off('click'); 
     // this statement doesn't work 
     // $('#search-submit').off('click', this.searchSubmit); 
     // This also doesn't work 
     // $(this.el).off('click', this.searchSubmit); 
    } 

Нажатие # поиск подать кнопка работает, как ожидалось. Щелчок на кнопке # some-button работает, поскольку он вызывает метод disableSearch. Однако я не могу удалить только событие click из кнопки # search-submit. Я могу удалить всех слушателей, но это не подходит для моей цели, потому что оно удаляет слушателя из # some-other-button.

Есть ли способ удалить только слушателей событий, которые меня волнуют, и оставить их неповрежденными? Есть ли лучший способ подключить слушателей событий в первую очередь? Спасибо ...

Answer 1

Вы можете удалить прослушиватель событий на определенный элемент по undelegating его:

this.$el.off('click', '#search-submit'); 

и демо http://jsfiddle.net/nikoshr/fS278/

Вы не можете удалить определенную функцию, при монтаже с помощью хэш-событий (Backbone преобразует функции, заставляя контекст this). Тем не менее, обращение с search-submit событий вложения себя позволит вам отвязать функцию:

var V = Backbone.View.extend({ 
    events: { 
     'click #some-button': 'disableSearch', 
     'click #some-other-button': 'someFunction' 
    }, 

    initialize: function() { 
     // let's make sure searchSubmit has the view as context 
     _.bindAll(this, 'searchSubmit'); 
     // and then direct the event to the bound function 
     this.$el.on('click', '#search-submit', this.searchSubmit); 
    }, 

    disableSearch: function(){ 
     // this.searchSubmit is the same function as in initialize 
     // it can be detached 
     this.$el.off('click', this.searchSubmit); 
     return false; 
    }, 

    searchSubmit: function() { 
     console.log('searchSubmit'); 
     return false; 
    } 
}); 

и демо http://jsfiddle.net/nikoshr/fS278/1/