5

Backbone.Marionette ビューの 1 つで 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#citySearchitemView の一部ではありません。これは、ビューのコンテナ要素内でフェッチ関数をイベントにバインドしていないことを意味します。keyup

ビューの外部にバインドする場合は、要素が存在するビューにイベントをトリガーできます。

于 2013-06-19T06:19:31.723 に答える