Épine dorsale de l'événement de tir sur cliquez OU appuyez sur entrée

Je suis nouveau à l'épine dorsale, et je suis à la recherche d'un moyen pour que mon bouton pour être déclenchée lorsque j'appuie sur Entrée ainsi que cliquant. Actuellement showPrompt s'exécute uniquement sur un clic. Ce qui est le plus propre plus secs de façon à exécuter sur la touche Entrée ainsi, de préférence, uniquement pour que le champ de saisie.

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

}());

Aussi où puis-je en savoir plus sur ce genre d'événement contraignant? Ne dorsale événements diffèrent de JS ou jQuery événements dans la façon dont ils sont définis?

OriginalL'auteur Melbourne2991 | 2013-12-04

19

En supposant que vous utilisez jQuery pour DOM manipulation, vous pouvez créer votre propre "minuscule" plugin qui déclenche l' Entrée événement dans les entrées. Mettre dans votre plugins.js ou ce que les scripts d'installation de fichier que vous avez:
```
$('input').keyup(function(e){
  if(e.keyCode == 13){
    $(this).trigger('enter');
  }
});
```
Maintenant que vous avez créé cette "entrée" du plugin, vous pouvez écouter de saisir les événements de cette façon:
```
events: {
  "click #add-friend": "showPrompt",
  "enter #friend-name": "showPrompt"
}
```
Ou, si vous voulez qu'il fonctionne sur n'importe quel élément (et pas seulement de l'entrée), vous pouvez faire quelque chose comme ce qui suit pour le jQuery extrait de code: $(document).keyup(function(e) { if (e.keyCode == 13) { $(':focus').trigger ("entrée");} });

OriginalL'auteur Daniel Aranda
17

Vous pouvez ajouter une plus event à votre events de hachage dans AppView.
```
events: {
   "click #add-friend":  "showPrompt",
   "keyup #input-field-id" : "keyPressEventHandler"
}
```
Où #input-field-id est celui que vous souhaitez ajouter un événement.

Puis ajouter eventHandler dans AppView.
```
keyPressEventHandler : function(event){
    if(event.keyCode == 13){
        this.$("#add-friend").click();
    }
}
```
REMARQUE : Ce code n'est pas testé, mais vous pouvez penser à le faire de cette façon.

Ont un coup d'oeil à cette de comprendre comment Backbone poignées events dans un View.

J'ai donc besoin d'avoir deux fonctions différentes? Keypress evennt gestionnaire et le spectacle invite.. hm suppose que c'est ok, il ne semble pas très SÈCHE
Vous pouvez penser d'appeler showPrompt de nouveau sur keyup avec un chèque de keyCode.
Plutôt que de déclencher une click événement sur un #add-friend, il suffit d'appeler this.showPrompt() serait suffisant.
a cette travaillé pour quelqu'un? d'où les upvotes?
quel problème avez-vous avec cette approche?

OriginalL'auteur Niranjan Borawake

Vous devez vous connecter pour publier un commentaire.