单击或按Enter时触发 Backbone.js 事件

fdbelqdn 于 2022-11-10 发布在其他

关注(0)|答案(2)|浏览(160)

我是一个新的 Backbone ，我正在寻找一种方法，我的按钮被触发时，我按下回车以及点击。目前showPrompt只执行一次点击。什么是最干净最干燥的方式，让它执行按下回车以及，最好只为该输入字段。

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

}());

还有，我在哪里可以读到更多关于这种事件绑定的信息？ Backbone.js 事件与JS或jQuery事件的定义有什么不同吗？

backbone.js

来源：https://stackoverflow.com/questions/20366768/backbone-event-firing-on-click-or-press-enter

2条答案

按热度按时间

xkftehaa1#

假设你使用jQuery作为DOM manipulation，你可以创建你自己的“小”插件，在输入中触发Enter事件，把它放在你的plugins.js或任何你有的安装脚本文件中：

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

现在您已经创建了这个“enter”插件，您可以通过以下方式监听enter事件：

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

赞(0）回复(0）举报 2022-11-10

scyqe7ek2#

您可以在AppView中的events散列中再添加一个event。

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如何在View中处理events。

赞(0）回复(0）举报 2022-11-10

我来回答

单击或按Enter时触发 Backbone.js 事件

2条答案

相关问题

热门标签

最新问答