При нажатии на кнопку "Магистраль" нажмите кнопку "Enter"

Я новичок в позвоночнике, и я ищу способ запуска моей кнопки, когда я нажимаю Enter, а также нажимаю. В настоящее время showPrompt выполняется только щелчком. Какой самый чистый DRYest способ заставить его выполнить при нажатии Enter, предпочтительно, только для этого поля ввода.

(function () {

  var Friend = Backbone.Model.extend({
    name: null
  });

  var Friends = Backbone.Collection.extend({
    initialize: function (models, options) {
      this.bind("add", options.view.addFriendLi);
    }
  });

  var AppView = Backbone.View.extend({
    el: $("body"),
    initialize: function() {
      this.friends = new Friends(null, {view: this});
    },
    events: {
      "click #add-friend":  "showPrompt",
    },
    showPrompt: function () {
      var friend_name = $("#friend-name").val()
      var friend_model = new Friend({ name:friend_name });
      this.friends.add( friend_model );
    },
    addFriendLi: function (model) {
      $("#friends-list").append("<li>" + model.get('name') + "</li>");
    }
  });

  var appView = new AppView; 

}());

Также, где я могу узнать больше об этой привязке событий? Разнообразные события отличаются от событий JS или jQuery в том, как они определены?

Ответ 1

Предполагая, что вы используете jQuery для манипуляций с DOM. Создайте "крошечный" плагин, который запускает событие Enter на входах. Поместите его в свой файл plugins.js или любой другой файл сценариев установки, который у вас есть:

  $('input').keyup(function(e){
   if(e.keyCode == 13){
      $(this).trigger('enter');
   }
 });

Имея плагин ввода, Backbone.js должен быть таким простым, как это:

events: {
   "click #add-friend":  "showPrompt",
   "enter #friend-name" : "showPrompt"
}

Ответ 2

Вы можете добавить еще один event к тэгу events в AppView.

events: {
   "click #add-friend":  "showPrompt",
   "keyup #input-field-id" : "keyPressEventHandler"
}

Где #input-field-id - это тот, который вы хотите добавить.

Затем добавьте eventHandler в AppView.

keyPressEventHandler : function(event){
    if(event.keyCode == 13){
        this.$("#add-friend").click();
    }
}

ПРИМЕЧАНИЕ. Этот код не проверен, но вы можете думать, что он делает это таким образом.

Посмотрите этот, чтобы понять, как Backbone обрабатывает events в View.