hacer - llamar funcion javascript desde html onclick

Activación de evento de red troncal al hacer clic O presione enter

Question

Soy nuevo en la red troncal y estoy buscando una manera para que se active mi botón cuando presiono Enter y también hago clic. Actualmente showPrompt solo se ejecuta con un clic. ¿Cuál es la forma más limpia de DRYest para ejecutar al presionar Enter también, preferiblemente solo para ese campo de entrada?

(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; 

}());

También, ¿dónde puedo leer más sobre este tipo de enlace de eventos? ¿Los eventos principales difieren de los eventos JS o jQuery en cómo se definen?

Answer 1

Puede agregar un event más a su hash de events en AppView .

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

Donde #input-field-id es el que desea agregar el evento.

A continuación, agregue eventHandler en AppView .

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

NOTA: Este código no está probado, pero puede pensar hacerlo de esta manera.

Eche un vistazo a esto para comprender cómo Backbone maneja events en una View .

Answer 2

Suponiendo que está utilizando jQuery para la manipulación DOM. Cree un complemento "pequeño" que dispare el evento Enter en las entradas. Ponlo en tu plugins.js o en cualquier archivo de scripts de configuración que tengas:

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

Tener el plugin enter, Backbone.js debería ser algo tan simple como esto:

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