Связывание нескольких типов событий в базовых представлениях

Question

Мне было интересно, можно ли связать несколько типов событий в магистрали в пределах одной строки.

Рассмотрим следующий пример:

var MyView = Backbone.View.extend({ 
    id: 'foo', 
    events: { 
     'click .bar': 'doSomething', 
     'touchstart .bar': 'doSomething' 
    }, 
    doSomething: function(e) { 
     console.log(e.type); 
    } 
}); 

В основном то, что я интересно, если это возможно совместить событие связывания для «нажмите» и «touchstart» в одну линию - по линии:

events: { 'click,touchstart .bar': 'doSomething' } 

Любые предложения будут оценены.

Answer 1

Для тех, кто заинтересован, я в конечном итоге переопределение delegateEvents в Backbone.View.

Для получения желаемой функциональности имеется только несколько модифицированных линий.

Вы можете увидеть различия в моем commit on github

Вот delegateEvents в измененном состоянии:

delegateEvents: function(events) { 
    if (!(events || (events = getValue(this, 'events')))) return; 
    this.undelegateEvents(); 
    for (var key in events) { 
     var method = events[key]; 
     if (!_.isFunction(method)) method = this[events[key]]; 
     if (!method) throw new Error('Method "' + events[key] + '" does not exist'); 
     var match = key.match(delegateEventSplitter); 
     var eventTypes = match[1].split(','), selector = match[2]; 
     method = _.bind(method, this); 
     var self = this; 
     _(eventTypes).each(function(eventName) { 
      eventName += '.delegateEvents' + self.cid; 
      if (selector === '') { 
       self.$el.bind(eventName, method); 
      } else { 
       self.$el.delegate(selector, eventName, method); 
      } 
     }); 
    } 
} 

Answer 2

Невозможно просмотреть события jQuery, которые связаны через delegateEvents. Это является possible for backbone events, хотя:

book.on("change:title change:author", ...); 

Answer 3

Мы также могли бы сделать это, как показано ниже. Преимущество управления пространством между каждым событием.

Github commit here

Добавьте его в Backbone непосредственно:

delegateEvents: function(events) { 
    events || (events = _.result(this, 'events')); 
    if (!events) return this; 
    this.undelegateEvents(); 
    for (var key in events) { 
    var method = events[key]; 
    if (!_.isFunction(method)) method = this[method]; 
    if (!method) continue; 
    var match = key.match(delegateEventSplitter); 
    this.delegate(match[1], match[2], _.bind(method, this)); 
    } 
    return this; 
} 

Override метод delegateEvents:

Backbone.View.prototype.originalDelegateEvents = Backbone.View.prototype.delegateEvents; 
Backbone.View.prototype.delegateEvents = function(events) { 
    events || (events = _.result(this, 'events')); 
    if (!events) return this; 
    this.undelegateEvents(); 
    for (var key in events) { 
     var method = events[key], combinedEvents = key.split(','); 
     if (!_.isFunction(method)) method = this[method]; 
     if (!method) continue; 

     for(var i = 0, match = null; i < combinedEvents.length; ++i) { 
      match = combinedEvents[i].trim().match(/^(\S+)\s*(.*)$/); 
      this.delegate(match[1], match[2], _.bind(method, this)); 
     } 
    } 
    return this; 
}; 

Теперь мы могли бы управлять события в одной строке:

events: { 
    'click a[data-anchor], wheel, keydown': 'scroll' 
}