5

我的一个 Backbone.Marionette 视图中的 JQuery 事件有问题。我已经定义了一些点击和键盘事件。但其中一些不起作用。例如，我希望每次触发 keyup 事件时都调用 fetch-function。

所以这里是代码：

return Backbone.Marionette.ItemView.extend({
  tagName: 'div',
  template: Template,
  events:{
     'click .yes': 'yes',
     'click .no': 'no',
     'keyup #citySearch': 'fetch'
  },
  yes : function() {
    this.close();
  },
  no : function() {
    this.close();
  },
  initialize: function(){
    this.collection = new AreaCollection();
    this.collection.on('sync', this.onShow, this);
    this.sourceArr = [];
  },
  onShow: function() {
      var that = this;
      $('#citySearch').typeahead({
          source: that.sourceArr
      });
  },
  fetch: function(ev) {
    var that = this;
    that.collection.fetch({
      data : {
        query : $(ev.currentTarget).val(),
        type : 'cities'
      },
      success: function(response) {
        for (var i = 0; i < response.length; i++) {
            that.sourceArr.push(response.models[i].get('name'));
        }
      }
    });
  }

});

但是 keyup-Event 永远不会被触发。我还尝试了“更改”事件，这也不起作用。当我改用“keydown”或“keypress”时，一切都很好，并且正确调用了获取功能。

我还尝试在初始化函数中手动将事件绑定到该输入字段

    $('input#citySearch').bind('keyup',function() {
        console.log('keyup');
    });

但这也行不通。仅当我将事件绑定到下划线模板文件中的输入字段时，它才有效。但这不可能是解决方案。

有人知道问题可能是什么吗？

4

1 回答 1

9

我只能想到一个原因。那就是：

input#citySearch不是您的 itemView 的一部分。这意味着您没有将 fetch 函数绑定keyup到视图的容器元素内的事件。

如果你想绑定到你的视图之外的东西，你可以触发一个事件到元素所在的视图。

于 2013-06-19T06:19:31.723 回答